1、用webstorm打sails项目,在当前项目目录下执行下面命令,安装express-react-views必要组件:
npm install express-react-views react react-dom
2、安装必要组件后,配置sails视图引擎,打开config/views.js添加如下代码:
extension: 'jsx',
getRenderFn: function () {
return require('express-react-views').createEngine();
}
3、创建一个测试控制器TestController(或执行generate new controller test),代码如下:
module.exports = {
test: function (req,res) {
return res.view('hello',{ name: "kimi" });
}
};
4、创建一个hello视图,代码如下:
var React = require('react');
class HelloMessage extends React.Component {
render() {
return Hello {this.props.name};
}
}
module.exports = HelloMessage;
5、配置policies和routers的信息,如下:
// policies.js
'test/test': true
// routers.js
'GET /test': { action: 'test/test' }
6、启动项目,打开浏览器查看效果,如下图: