如何在 vue js 中绑定 span？

Question

<span id="spanNum" name="number" style="font-weight:bold; font-size:2rem;">{{randomNumberCreate()}}</span>

data:{

x:this.randomCreate()
}

methods:{

  randomNumberCreate : function(){
                  return  Math.floor(Math.random() * 9999) + 1000;

           }
}

mounted(){
this.randomNumberCreate()
}

这是完美的，但我有一个问题。我的问题是我想在数据部分的 x 中绑定跨度值（随机数）。

我使用了其他函数并使用了 getElementByID 但 return function(){native code}。如何将数据部分中的 x 绑定到跨度值？

Answer 1

目前，您的方法 randomNumberCreate() 会在您每次调用时 return 生成一个随机数，正如预期的那样。因此，您不能仅通过此方法重复使用 returned 编号。

您可以做的，并且您已经尝试过这样做，就是将 returned 号码分配给属性。你在这里做的：

x: this.randomCreate()

现在您可以像这样在您的组件中重用 x：

<span :id="x" name="number" style="font-weight:bold; font-size:2rem;">{{x}}</span>

在这种情况下 :id="x" 将具有与 {{x}} 相同的随机数。

如何在 vue js 中绑定 span？

How to bind span in vue js?

vue.js

vue-component

vuejs2

vuetify.js