我是 react 和 mobx 的新手。我正在尝试仅针对示例使用@computed方法。我有复选框，更改后，状态(用户名(会更改，但@computed方法不会调用。这是我的代码：
登录存储.js：
import { computed, observable } from "mobx";
class LoginStore {
@observable
username = "Daimon";
@computed
get report() {
return this.username + "12345";
}
}
var store = new LoginStore;
export default store;
自动化：
import React, { Component } from 'react';
import { observer } from "mobx-react";
@observer
class Autorization extends Component {
test = () => {
this.props.store.username = "krikkk";
}
render() {
return (
<body>
<p>{this.props.store.username}</p>
<input type="checkbox" class="custom-control-input" id="customCheck1" onChange={this.test}/>
</body>
);
}
}
export default Autorization;
索引.js：
import React from 'react';
import ReactDOM from 'react-dom';
import App from './App';
import Autorization from './Autorization';
import registerServiceWorker from './registerServiceWorker';
import loginStore from "./stores/LoginStore";
ReactDOM.render(<Autorization store={loginStore}/>, document.getElementById('root'));
registerServiceWorker();
package.json：
{
"name": "autorization",
"version": "0.1.0",
"private": true,
"dependencies": {
"custom-react-scripts": "^0.2.2",
"mobx": "^5.1.2",
"mobx-react": "^5.2.8",
"react": "^16.5.2",
"react-dom": "^16.5.2",
"react-scripts": "1.1.5"
},
"scripts": {
"start": "react-scripts start",
"build": "react-scripts build",
"test": "react-scripts test --env=jsdom",
"eject": "react-scripts eject"
},
"devDependencies": {
"babel-plugin-transform-class-properties": "^6.24.1",
"babel-plugin-transform-decorators-legacy": "^1.3.5"
}
}
有人知道如何解决它吗？
更改用户名后，不会重新调用您的@computed方法，因为报告方法本身未在任何有效位置使用。
来自官方的 mobx 文档：
如果影响计算值的任何值发生更改，则会自动从您的状态派生计算值。在许多情况下，MobX 可以优化计算值，因为它们被认为是纯值。例如，如果上一次计算中使用的数据均未更改，则计算属性不会重新运行。如果计算属性未被其他计算属性或反应使用，则也不会重新运行。在这种情况下，它将被暂停。
要进行测试，在授权组件的呈现中，您可以更改
<p>{this.props.store.username}</p>
自
<p>{this.props.store.report}</p>