我有这个基本的 React (MobX) 商店。Gulp 运行正常,但在浏览器中仍然出现错误(Uncaught TypeError: Cannot read property 'apply' of undefined)。我测试了一切,如果我不添加@observable,那么它就可以工作。在生成的js文件中,问题发生在解释注释的同一位置。
import React, {Component} from 'react';
import {autorun, observable, computed} from "mobx";
class Store {
@observable elements = [];
constructor() {
this.elements = [];
}
clickElement(id) {
if (this.elements.length > 1) {
for (var i=0; i < this.elements.length; i++) {
this.elements[i].clicked = false;
if (this.elements[i].id == id) {
this.elements[i].clicked = true;
}
}
}
}
getSelectedIndex() {
for (var i=0; i < this.elements.length; i++) {
if (this.elements[i].clicked) {
return 0;
}
}
return 0;
}
}
var store = new Store();
export default Store;
autorun(() => { console.log(store.elements) })
Gulp 任务提取:
gulp.task('build:react', function () {
var paths = {
src: path.join(config.baseDir, 'my.jsx'),
dest: path.join(config.baseDir, 'scripts')
};
gulp.src(paths.src)
.pipe(webpackStr({
module: {
loaders: [
{
test: ['', '/\.js?$/', '/\.jsx?$/'],
loader: 'babel',
exclude: /(node_modules)/,
query: {
presets: ['react', 'es2015', 'stage-0'],
plugins: ['transform-decorators-legacy']
}
}
]
}
}))
.pipe(concat('react.js'))
.pipe(gulp.dest(pathsShop.dest));
});
生成的代码:
var _class, _desc, _value, _init;
var _react = __webpack_require__(2);
var _react2 = _interopRequireDefault(_react);
var _mobx = __webpack_require__(399);
var DetailPageStore = (_class = function () {
function DetailPageStore() {
_classCallCheck(this, DetailPageStore);
this.elements = _init.apply(this);
}