React Mobx nicht rendern den Wert

Question

Ich bin neu zu reagieren & mobx. Ich habe eine einfache Klasse mit Mobx erstellt.

Beim Rendern der Ansicht wird der Inhalt, der @observable hat, nicht gerendert.

Hinweis: Ich habe nicht meine app erstellen mit create-reagieren-App

Mein Code:

import {observable, computed} from 'mobx'; 
    import {observer} from 'mobx-react'; 
    import React from 'react'; 
    import {Component} from 'react' 


    @observer class store extends Component { 
     @observable count = 0; 
     render(){ 
      return(
       <div> 
        Counter : {this.count} <br/> 
        <button onClick={this.handleInc}>+</button> 
        <button onClick={this.handleDec}>-</button> 
       </div> 
      ) 
     } 

     handleInc=() =>{ 
      this.count++; 
     } 

     handleDec=() =>{ 
      this.count--; 
     } 
    } 

export default store; 

Package.json:

{ 
    "name": "new-react-app", 
    "version": "1.0.0", 
    "description": "", 
    "main": "webpack.config.js", 
    "scripts": { 
    "test": "echo \"Error: no test specified\" && exit 1", 
    "example": "webpack-dev-server --progress --color --watch" 
    }, 
    "author": "", 
    "license": "ISC", 
    "devDependencies": { 
    "babel-cli": "^6.24.1", 
    "babel-core": "^6.24.1", 
    "babel-loader": "^7.0.0", 
    "babel-plugin-transform-class-properties": "^6.24.1", 
    "babel-plugin-transform-decorators": "^6.24.1", 
    "babel-plugin-transform-decorators-legacy": "^1.3.4", 
    "babel-plugin-transform-runtime": "^6.23.0", 
    "babel-preset-env": "^1.4.0", 
    "babel-preset-es2015": "^6.24.1", 
    "babel-preset-react": "^6.24.1", 
    "babel-preset-stage-1": "^6.5.0", 
    "css-loader": "^0.28.1", 
    "style-loader": "^0.17.0", 
    "webpack": "^2.5.1", 
    "webpack-dev-server": "^2.4.5" 
    }, 
    "dependencies": { 
    "awesomplete": "^1.1.1", 
    "babel-loader": "^6.2.4", 
    "babel-preset-stage-1": "^6.24.1", 
    "d3": "^4.9.1", 
    "material-ui": "^0.18.1", 
    "material-ui-settings-panel": "^0.1.1", 
    "mobx-react": "^4.2.1", 
    "react": "^15.5.4", 
    "react-bootstrap": "^0.31.0", 
    "react-bootstrap-table": "^3.3.4", 
    "react-bootstrap-typeahead": "^1.3.0", 
    "react-dom": "^15.5.4", 
    "react-md": "^1.0.13", 
    "react-router": "^2.0.0", 
    "react-table": "^4.2.0", 
    "react-tap-event-plugin": "^2.0.1", 
    "react-transition-group": "^1.1.3", 
    "reactstrap": "^4.6.2" 
    }, 
    "compilerOptions": { 
    "experimentalDecorators": true, 
    "allowJs": true 
    } 
} 

webpack.config. js:

module.exports = { 
    entry: "./entry.js", 
    output: { 
     path: __dirname, 
     filename: "bundle.js" 
    }, 
    module: { 
     loaders: [ 
      { 
       test: /\.css$/, 
       use: [ 
       { loader: 'style-loader' }, 
       { loader: 'css-loader' } 
       ], 
      }, 
      { 
       test: /\.(js|jsx)$/, 
       loader: 'babel-loader', 
       exclude: /node_modules/, 
       query: { 
        presets: ['es2015', 'stage-0', 'react'], 
        plugins : ["transform-class-properties","transform-decorators-legacy",'transform-runtime', "transform-decorators"] 
       } 
      } 

     ] 
    } 
}; 

Bitte helfen Sie mir dieses

Answer 1

Problem zu beheben wurde fixiert, indem die Plugins als

Plugins zu ändern: [ 'transformationsLaufZeit', 'transformations Dekorateure-Vermächtnis']

Danke für die Hilfe:)