首页 > 其他 > 详细

19-template转render写法

时间:2019-07-05 20:15:24      阅读:88      评论:0      收藏:0      [点我收藏+]

<div id="app">

<ele></ele>

</div>

<script>

Vue.component(‘ele‘,{

template:`<div id="element" :class="{show:show}" @click="handleClick">文本内容</div>`,

data(){

return{

show:true

}

},

methods:{

handleClick(){

console.log("clicked")

}

}

});

var app = new Vue({

el:"#app"

})使用render修改后:

<div id="app">

<ele></ele>

</div>

<script>

Vue.component("ele",{

render:function(createElement){

return createElement{

"div",

{

//动态绑定class,同:class

class:{

"show":this.show

},

//普通HTML特性

attrs:{

id:"element"

},

//给div绑定click事件

on:{

click:this.handleClick

}

},

"文本内容"

}

},

data(){

return{

show:true

}

},

methods:{

handleClick(){

console.log("clicked")

}

}

})

19-template转render写法

原文:https://www.cnblogs.com/Romantic-Blood/p/11140427.html

(0)
(0)
   
举报
评论 一句话评论(0
关于我们 - 联系我们 - 留言反馈 - 联系我们:wmxa8@hotmail.com
© 2014 bubuko.com 版权所有
打开技术之扣,分享程序人生!