小编rec*_*eco的帖子

vue.js 在 Render 函数中为按钮添加事件监听器

我想使用 Vue.js Render 函数在 javascript 中制作组件。现在我可以制作一个 HTML 结构,一个 SPAN 和一个按钮。当我点击按钮时,我希望它在控制台中输出,但它只是不起作用。这是我的代码:

<script src="https://unpkg.com/vue/dist/vue.js"></script>
<div id="app">
  <counter></counter>
</div>
<script>
    var a = {
           data () {
              return {count: 1}
            },
            methods: {
              inc () {console.log(this.count)}
            },
            render:function(h){
              var self = this
              var buttonAttrs ={
                    on:{click:self.inc}
                  }
              var span = h('span',this.count.toString(),{},[])
              var button = h('button','+',buttonAttrs,[])
              return h('div' 
                ,{},
                [
                  span,
                  button
                ])

            }
      }

  new Vue({
    el:'#app',
    components:{
      counter : a
     }}
  )

</script>
Run Code Online (Sandbox Code Playgroud)

或在codepen 上欢迎任何回复,谢谢。

javascript vue.js vue-component

2
推荐指数
1
解决办法
3113
查看次数

标签 统计

javascript ×1

vue-component ×1

vue.js ×1