Question

我需要将一个已编译的元素插入到$f3->reroute('@path_name?foo=bar')中，但是它会被插入一个随机位置，而不是像文档那样插入预定位置......

DOM

var res = Vue.compile('<div><span>{{ msg }}</span></div>') new Vue({ data: { msg: 'hello' }, render: res.render, staticRenderFns: res.staticRenderFns })，V-for的所有方法都无法使用，因为它们也需要预定义的元素。

我尝试过这样的事情......

V-if/show

它返回一个包含'render'和'StaticRenderFns'的对象，但没有找到在这些对象上编译的结果，在我看来它被记录在'Promisse'中，当元素被预定义时触发'DOM'。

最后，如何使用'Vue 2'插入编译到DOM中的元素？

Answer 1

试试这个

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<button>Clone element</button>

<tr class="RowBG2">
  <th rowspan="3" scope="rowgroup" style="text-align: left;vertical-align: top;" class="hdngArial specs-mainHeading bottom-border-section">Frequency</th>
  <th scope="row" align="left" class="hdngArial specs-subHeading RowBG1 bottom-border">2G Band</th>
  <p class="fasla RowBG1 specs-value bottom-border"><b>SIM1:</b> GSM 850 / 900 / 1800 / 1900<br><b>SIM2:</b> GSM 850 / 900 / 1800 / 1900 &nbsp;</p>
</tr>

<tr class="RowBG2" style="background-color: #ebf1fa; color: #666666; font-family: Arial, Helvetica, sans-serif; font-size: 16px;">
  <td class="hdngArial" height="25" style="font-size: 10pt; font-weight: bold;">&nbsp;2G &nbsp;Band&nbsp;
  </td>
  <td id="2g" colspan="2"></td>
</tr>

示例来自： https://vuejs.org/v2/api/#vm-mount

Answer 2

你几乎把它弄好了，但是为了安装它，你使用.$mount()（就像@ Wszerad的回答一样）：

console.clear();

var res = Vue.compile('<div><span>{{ msg }}</span></div>');

console.log(res);

var vm = new Vue({
  data: {
    msg: 'hello'
  },
  render: res.render,
  staticRenderFns: res.staticRenderFns
});

vm.$mount('#app')

<script src="https://unpkg.com/vue@2.5.5/dist/vue.js"></script>
<body>
  <div id="app"></div>
</body>

插入DOM时Vue编译

2 个答案: