Question

我正在尝试预处理Vue 2模板并获取所有元素绑定的列表。因此，如果我有一个像这样的文件：

<html>
<body>
<div id="app">
    <p>Here's a message: {{message1}}</p>
    <p>Here's an input: <input type="text" v-model="message2"></p>
</div>

<script type="application/javascript" src="vue.js"></script>
<script type="application/javascript">
    new Vue({
        el: "#app",
        data: {
            message1: "foo",
            message2: "bar"
        }
    });
</script>
</body>
</html>

然后在某个地方（beforeMount？），我可以查询Vue，它会告诉我绑定是['message1'，'message2']。有可能吗？

Answer 1

最后，我通过获取render函数的文本（通过调用vm。$ options.render.toString（））来解决此问题，然后从中解析出绑定。

例如，简单列表视图的呈现功能如下：

function() {
  var _vm = this
  var _h = _vm.$createElement
  var _c = _vm._self._c || _h
  return _c(
    "table",
    { attrs: { border: "1", cellpadding: "5", cellspacing: "0" } },
    [
      _vm._m(0),
      _vm._l(_vm.rows, function(row) {
        return _c("tr", [
          _c(
            "td",
            [
              _c("router-link", { attrs: { to: "/detail/" + row.ID } }, [
                _vm._v(_vm._s(_vm._f("truncate")(row.TITLE, 100)))
              ])
            ],
            1
          ),
          _c("td", [_vm._v(_vm._s(_vm._f("truncate")(row.DESCRIPTION, 200)))]),
          _c("td", [_vm._v(_vm._s(row.TYPE))])
        ])
      })
    ],
    2
  )
}

使用过滤器时，绑定似乎总是包含在_s（）元素中，并且可选地包含在 vm.f （）指令中。

从Vue模板读取所有元素绑定

1 个答案: