Question

我是Vue.js的新手。我设计了一个简单的程序，我拿了两个文本框，它们接收输入并显示它们旁边的输入计数。第三个文本框显示输入的总和。该计划工作正常。但我希望这可以使用组件来完成，而不是通过这种方式。所有三个文本框都应该是组件并执行相同的任务。请帮助。

这是我的代码。

HTML： -

<!DOCTYPE html>
<html>
<head>
    <title></title>
    <meta charset="utf-8" />
</head>
<body>
    Enter value : <input v-model="groupId" /> {{groupId.length}}
    <br /><br />
    Enter value : <input v-model="groupId1" /> {{groupId1.length}}
    <br /><br />
    Output : <input v-model="groupId2" value="{{groupId.length + groupId1.length}}" readonly />
</body>
<script src="//cdnjs.cloudflare.com/ajax/libs/vue/1.0.27/vue.min.js"></script>
<script src="textLength.js"></script>
</html>

Javascript代码： -

new Vue（{ el：＆＃39; body＆＃39;，数据：{ groupId：null， groupId1：null ， groupId2：null }

}）;

如何使用Vue.js计算输入文本长度？

0 个答案: