Question

我有这个Vue Material（Vue.js）标签，功能

<md-button id="" v-on:click.native="requestSelected(request)">


methods: {

        requestSelected: function(request) {
            request.accepted = true;
            console.log(request);

            var card = document.getElementById('text');
            var accept = document.createTextNode("Job selected");

            card.appendChild(accept);

        }

我试图在点击后在DOM上添加一些文字，有人可以向我推荐一些Vue js documentacion来检查信息吗

Answer 1

在Vue组件中，为显示文本创建数据属性：

data() {
  return {
    displayText: '',
  }
}

然后，只需在模板中引用displayText，就像这样：

{{ displayText }}

Vue最初不会显示任何内容，因为displayText为空，并且会在displayText更改时自动更新DOM。

您可以更改requestSelected方法中的文字，如下所示：

requestSelected: function(request) {
  request.accepted = true;
  this.displayText = "Job selected";
}

Here's an example in codepen.

单击后，Vue.js附加文本。怎么样？

1 个答案: