vue,layui怎么拼接<dl>标签

Question

<dl class="layui-nav-child" id="List">
<dd><a href='javascript:void(0);' @click='to()' value='"+a+"'>"+a+"</a></dd>
</dl>

$("#List").append("+<dd><a href='javascript:void(0);' @click='to()' value='"+a+"'>"+a+"</a></dd>+");

现在的问题是为什么我直接写在templet里的这个@click就可以正常使用的但是我这样拼接的能够显示但是这个@click不生效

Answer 1

可以参考下面的代码，如果可以请点击”采纳“：

<template>
  <div>
    <dl class="layui-nav-child" id="List">
      <dd v-for="item in list" :key="item.id">
        <a href="javascript:void(0);" @click="to(item.value)">{{ item.value }}</a>
      </dd>
    </dl>
  </div>
</template>

<script>
export default {
  data() {
    return {
      list: []
    }
  },
  methods: {
    to(value) {
      console.log(value)
    },
    addItem(a) {
      this.list.push({ id: this.list.length + 1, value: a })
    }
  },
  mounted() {
    this.addItem(a)
  }
}
</script>