使用 jquery 动态生成的 html，vue 的data 的值没有绑定上去，请问怎么绑定绑定？

Question

//            html
<div id="app">
  <div id="c"></div>
</div>
<script id="tpl" type="text/template">
<div style="display: inline-block;">
    <input type="radio" name="payway" v-model="payway" value="wx"/>
  <input type="radio" name="payway" v-model="payway" value="zfb"/>
</div>
</script>
//            js
new Vue({
  el: "#app",
  data: {
    payway: "wx"
  },
  mounted: function(){
    $("#c").html($("#tpl").html())
  }
})

radio没有被选中(绑定data)

---

• 生成的东西没有绑定上去值，怎么实现 jquery 生成的html的就绑定上去值呢？
• 或者不应该这样做，而应该用组件来做？但是组件如何实现呢？

补充：实际上我的代码是用了一个弹出层插件http://layer.layui.com/

layer.open({
    type: 1,
    skin: 'layui-layer-rim', //加上边框
    area: ['500px', '500px'], //宽高
    content: $("#paytpl").html() // 这里就是<script type="text/template">中的内容,所以生成的东西就没有绑定vue的data了
});
// content: html字符串 //这个就是弹出层的内容，它里面就要写html代码，也就是说不知道怎么在这个html 绑定vue的数据

Answer 1

你用到了动态模板，这个模板里除了标准的html部分，剩下的比如绑定和组件都不会生效，解决方法是先编译，而且这还需要你使用的是完整版本的vue，而不是runtime版本的vue，并且要使用专门的tag，参考官方文档中的这一段 https://vuejs.org/v2/guide/co...

不过，从你的代码逻辑，没看出来为什么需要使用动态模板，静态模板不可以吗？

Answer 2

vue可以操作dom？？？

Answer 3

this.$refs.paytpl.$el.cloneNode(true) 克隆下节点不行吗