Checkbox 为什么我的函数没有'；使用v-for vue js复选框时无法工作？

我想按优先级顺序拖放表行排序

选中复选框后，将移动到此div类中：

这很好用， 但当我使用v-for vue js更改为checkbox dynamic时，它不起作用，我不知道为什么。像这样：

<div class="test__list__checkbox checkbox-test">
<ul>
    <li v-for="test_list in dt_test_list">
        <div class="form--checkbox__wrapper">
            <span class="priority"></span>
            <input type="checkbox" id="checkbox-@{{ test_list.id }}" class="checkbox--input">
            <label for="checkbox-@{{ test_list.id }}" class="checkbox--label">@{{ test_list.type }}</label>
        </div>  
    </li>
</ul>

@{{test_list.type}

---

有人帮我吗？非常感谢

在您的vue实例之前，似乎已经启动了document ready

因此，您只需要使用vue的ready方法来初始化可排序的代码逻辑

首先将加载所有数据，然后您可以使用

new Vue({
el: 'body',
ready:function(){
  this.initializeSortable();
},
methods: {
  initializeSortable: function() {
    // your all code here after vue instance is ready and loop is done
  }
});

这是我们对所有预加载元素的第一步

现在，如果添加新元素，则需要编译vue的html，使该html的行为类似于vue组件

    addNewElement: function(){
       var element = $('#app').append('<div>some html variable</div>');
       /* compile the new content so that vue can read it */
       this.$compile(element.get(0));
    },

addNewElement:function（）{
var元素=$（'#app'）.append（'somehtml变量'）；
/*编译新内容，以便vue可以阅读*/
这个.compile（element.get（0））；
},

在这里，您的元素将成为新的append元素

---

然而，在vue中，他们说这种动态创建/编译不是好的做法。

你能发布包含模板的组件的代码吗？

v-for

（和

dt\u test\u list

）？请添加js代码以将vue绑定到html

<div class="test__list__checkbox checkbox-test">
<ul>
    <li v-for="test_list in dt_test_list">
        <div class="form--checkbox__wrapper">
            <span class="priority"></span>
            <input type="checkbox" id="checkbox-@{{ test_list.id }}" class="checkbox--input">
            <label for="checkbox-@{{ test_list.id }}" class="checkbox--label">@{{ test_list.type }}</label>
        </div>  
    </li>
</ul>

new Vue({
el: 'body',
ready:function(){
  this.initializeSortable();
},
methods: {
  initializeSortable: function() {
    // your all code here after vue instance is ready and loop is done
  }
});

    addNewElement: function(){
       var element = $('#app').append('<div>some html variable</div>');
       /* compile the new content so that vue can read it */
       this.$compile(element.get(0));
    },