Vue.js 如何添加用户输入vue&；axios api调用？

我正在尝试为要添加到我的应用程序的查询添加一个用户输入，该应用程序使用一个新闻API。使用Vue和Axios。 它与默认链接一起工作，但是，为“查询”实现用户输入不起作用

这么简单我 我正在尝试添加一个搜索功能，以便用户插入他们想要的任何新闻主题。 如有任何指导和解决方案，将不胜感激

问候

var vm=new Vue({
el:“#应用程序”，
数据：{
状态：“”
},
已创建：函数（）{
this.loadNews（）；
},
方法：{
loadNews:function（）{
this.status='Loading…'；
var vm=这个；
axios.get（）https://newsapi.org/v2/everything?q=“+query+”&apiKey=6d2c267eacd549e79d27f597d7917699“）
.然后（功能（响应）{
vm.status=response.data.articles[0]。作者+response.data.articles[0]。标题+response.data.articles[0]。url；
})
.catch（函数（错误）{
vm.status='发生错误'+错误；
})
}
}
});

应用程序
{{status}}

看起来您没有正确绑定输入

将数据更改为

data:{
  status:'',
  query: ''
}

和axios的url

axios.get('https://newsapi.org/v2/everything?q=' + this.query + "&apiKey=6d2c267eacd549e79d27f597d7917699"')

我如何让它提交请求？使用click事件创建一个新按钮。提交