Vue.js @提交不触发方法vue/quasar

注：根据我的代码，正确答案在答案中

错误原因：在最新版本的Quasar（1.2.4）中，q输入组件的v槽：后槽中的q-btn组件将不再提交q-form（即使添加了type=“submit”）

我只是想知道我的

q-btn

没有触发

sendMessage（）

方法时犯了什么错误

导出默认值{
数据（）{
返回{
新消息：“”，
信息：[
{
短信：“哟，伙计”，
来自：“我”
},
{
短信：“哟，伙计，我是他们”，
来自：“他们”
},
{
文本：“Yo duqweqrfq”，
来自：“我”
}
]
}
},
方法：{
sendMessage（）{
log（“新消息到达”）；
这个是.messages.push({
text:this.newMessage，
来自：“我”
});
}
}
};

我认为提交按钮在

QInput

的模板中不起作用。您需要将Submit按钮置于

QInput

之外，或者您可以使用button click事件

<q-form class="full-width" @submit="sendMessage">
         <div class="row">
          <q-input v-model="newMessage" bg-color="white" outlined rounded label="Message" class="col-11" dense>
          </q-input>
          <q-btn type="submit" icon="send" color="primary" round dense flat class="col-1" />
         </div>
       </q-form>

或

注：在最新版本的Quasar（1.2.4）中，q输入组件的v槽：后槽中的q-btn组件将不再提交q-form（即使添加了type=“submit”）

---

更改按钮类型=单击方法时提交。类星体在最近的版本中改变了一些东西

<q-btn @click="sendMessage" icon="send" color="white" round dense flat />

<q-btn @click="sendMessage" icon="send" color="white" round dense flat />