magix-transform-jsx
v1.0.0
Published
将jsx转换到magix的虚拟dom
Downloads
4
Readme
jsx转换插件
用于将magix代码中的jsx模板写法,转换成magix需要的vdom格式。达到在magix里面写jsx的目的。
目前已经实现jsx的所有语法:示例代码如下:
import * as Magix from "../lib/magix"
import Test from "./test.jsx"
module.exports = Magix.View.extend({
tmpl: function (data) {
var a1='"';
if(data.key==1){
return (
<div data-id="2222">
<Test x="2222" m={{a:1111}} class="xxx"/>
<span class="mmmm" id="2222">1111</span>
<span onClick={this.testcb.bind(this,{a:222})} test="2">2222</span>
</div>
)
}else{
return (
<div data-id="2222">eeeeee</div>
)
}
},
ctor: function (opt) {
},
render: function () {
this.updater.digest()
setTimeout(()=>{
this.updater.set({
"key":1
}).digest()
},1000)
},
testcb: function(data,e){
console.log(data)
}
})
安装使用
tnpm install magix-transform-jsx --save
webpack
配置babel插件
module: {
rules:[
{
test: /\.(jsx|js)$/,
// exclude: /(node_modules|bower_components)/,
use: {
loader: 'babel-loader',
options: {
presets: ['env','stage-0'],
plugins: ['magix-transform-jsx']
}
}
}
]
}
其他场景
使用api转换
let transform = require('magix-transform-jsx')
transform.parase('')
transform.generate('')