Skip welcome & menu and move to editor
Welcome to JS Bin
Load cached copy from
 
<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width">
  <title>JS Bin</title>
  <script src="https://cdnjs.cloudflare.com/ajax/libs/mobx/3.3.1/mobx.umd.js"></script>
</head>
<body>
  <h2>care:</h2>
  <ol>
    <li>wdz的值变化</li>
    <li>greet直接赋值</li>
    <li>greet的get和set方法</li>
  </ol>
  <br />
  <div>输出:</div>
  <br />
  <div id="console"></div>
</body>
</html>
 
const { 
  computed,
  observable,
  autorun
} = mobx;
class Person {
  @observable firstName;
  @observable secondName;
  constructor(firstName, secondName) {
    this.firstName = firstName;
    this.secondName = secondName;
  }
   
  @computed get fullName() {
    return this.firstName + 
           ' ' +
           this.secondName;
  }
}
   
const wdz = new Person('Demian', 'Wang');
const greet = observable('good morning! ');
const render = () => {
  document.getElementById('console').innerText =
    greet + wdz.fullName;
}
autorun(render);
Output

You can jump to the latest bin by adding /latest to your URL

Dismiss x
public
Bin info
Wangdz0822pro
0viewers