在DataTables中,我将render()
放入columnDefs
中,以允许在非常简单的绑定中使用自定义html。我想将vue语法放入render函数中,并使数据表将该块扔到每一行上。像这样:
new Vue({
el: "#app",
components: {"data-tables": datatables},
data: {
message:"hi",
tableData: [...]
columnDefs: [{
title: "Actions", width: "20%", data: null,
render: (data: any, type: string, row: any, meta: object) => {
return `<div class="row hcenter">
<a title="Edit" class="btn btn-default" type="button">
<i class="fa fa-edit"></i>{{message}}
</a>
</div>`}
}]
}
})
和模板:
{
template: '<table v-bind:id="tableId"></table>',
props: ["tableData", "columnDefs", "options", "tableId"],
data() {
return { dtHandle: null }
},
watch: {
tableData(val, oldVal) {
...
}
},
mounted() {
this.$nextTick(() => {
// Other things
...
// Create datatable and save
this.dtHandle = $(this.$el).DataTable(options);
// Probably something here to bind anything new <<<<<<<<<<<<<<<<<<<<<<
});
}
}
来自淘汰赛世界,我将做以下事情以便按需应用绑定:
ko.cleanNode(element);
ko.applyBindings(context, element);
Vuejs中是否有类似的东西可以让我在页面上扔任意HTML,并将Vue绑定到当前模型?
或者,还有另一种方法可以做到这一点或类似的方法吗?我试图使datatables组件尽可能简单和通用,所以我真的很想从包含页面传递所有信息。