当前位置: 动力学知识库 > 问答 > 编程问答 >

javascript - Cannot access a variable inside the same class

问题描述:

I have a MobX store like the following Store class. When I want to access this.user.permits.db, I receive an error that this.user is undefined. I wonder why I cannot access the @observable user.

src/ui/store/store.js file:

import { action, observable } from 'mobx'

import { useStrict } from 'mobx';

useStrict(true);

class Store {

constructor(){

//

}

@observable user

@action setUser=(user)=>{

this.user=user

}

@observable menus=[

{menu1: 'DATABASE',

/*menu2s: ['PC', 'NETWORK', 'TEL', 'PTT'],*/ //-> this line works fine

menu2s: this.user.permits.db, //-> this line gives an error: Cannot read property 'permits' of undefined

}

]

}

export default new Store

src/ui/ui.js file which imports store from store.js:

import React from 'react'

import ReactDOM from 'react-dom'

import Layout from './components/layout.js'

import Store from './store/store.js'

//user comes from HTTP GET request

Store.setUser(user)

ReactDOM.render(<Layout store={Store}/>,document.getElementById('ui'))

src/views/profile.ejs file, passing user to JavaScript:

<!DOCTYPE html>

<html lang='en'>

<head>

<title>User profile</title>

<link href="/css/style.css" rel="stylesheet" type="text/css">

</head>

<!--

Pass variables from http GET to JavaScript

also block script injection attacks

ref: http://stackoverflow.com/a/16098699/7312233

-->

<script>

function htmlDecode(input){

var e=document.createElement('div');

e.innerHTML=input;

return e.childNodes.length===0?"":e.childNodes[0].nodeValue;

}

var user=JSON.parse(htmlDecode("<%= JSON.stringify(user) %>"));

</script>

<div id="ui"></div>

<script src="/js/ui.bundle.js"></script>

</html>

A permits field on a sample user document on CouchDB user database is defined like below:


UPDATE:

Also this should be corrected too.

网友答案:

this.user is not set when you declare your class, so this.user.permits will give rise to an error. You could do something like this instead:

class Store {
  @observable user
  @observable menus = []
  @action setUser = (user) => {
    this.user = user
    this.menus.push({
      menu1: 'DATABASE',
      menu2s: this.user.permits.db
    })
  }
}
分享给朋友:
您可能感兴趣的文章:
随机阅读: