在VueJS中使用新行显示在表单中输入的文本

，可以通过以下步骤实现：

1. 首先，在Vue组件中定义一个data属性，用于存储输入的文本和显示的文本列表。例如：

data() {
  return {
    inputText: '',
    textList: []
  }
}

1. 在模板中，使用v-model指令将输入框与data属性中的inputText绑定，以实现双向数据绑定。同时，使用v-for指令遍历textList数组，将每个文本显示为一个新行。例如：

<input v-model="inputText" type="text" />
<button @click="addText">添加</button>

<div v-for="text in textList" :key="text">{{ text }}</div>

1. 在Vue组件的方法中，定义一个addText方法，用于将输入的文本添加到textList数组中，并清空输入框的内容。例如：

methods: {
  addText() {
    if (this.inputText.trim() !== '') {
      this.textList.push(this.inputText);
      this.inputText = '';
    }
  }
}

这样，当用户在输入框中输入文本并点击添加按钮时，输入的文本会被添加到textList数组中，并在页面上以新行的形式显示出来。

在VueJS中，可以使用以上方法实现在表单中输入的文本以新行的形式显示出来。这种方式适用于需要展示多个输入文本的场景，比如留言板、评论列表等。

腾讯云相关产品和产品介绍链接地址：

• 云服务器（CVM）：https://cloud.tencent.com/product/cvm
• 云数据库 MySQL 版（CDB）：https://cloud.tencent.com/product/cdb
• 云原生应用引擎（TKE）：https://cloud.tencent.com/product/tke
• 云存储（COS）：https://cloud.tencent.com/product/cos
• 人工智能（AI）：https://cloud.tencent.com/product/ai