html使用vue axios,使用 Vue和axios

html使用vue axios,使用 Vue和axios昨天写完了博客以后,有人就在我的博客下面留言说现在不是使用了Axios了吗?我赶紧再把Axios的例程给补上,并且做一个更新。其实vue-resource并不复杂,就是不稳定。Vue官方放弃它也是对的,作者是这样子说的最近团队讨论了一下,Ajax本身跟Vue并没有什么需要特别整合的地方,使用fetchpolyfill或是axios、superagent等等都可以起到同等…

大家好,又见面了,我是你们的朋友全栈君。如果您正在找激活码,请点击查看最新教程,关注关注公众号 “全栈程序员社区” 获取激活教程,可能之前旧版本教程已经失效.最新Idea2022.1教程亲测有效,一键激活。

Jetbrains全家桶1年46,售后保障稳定

昨天写完了博客以后,有人就在我的博客下面留言说现在不是使用了Axios了吗?我赶紧再把Axios的例程给补上,并且做一个更新。

其实vue-resource并不复杂,就是不稳定。Vue官方放弃它也是对的,作者是这样子说的

最近团队讨论了一下,Ajax 本身跟 Vue 并没有什么需要特别整合的地方,使用 fetch polyfill 或是 axios、superagent 等等都可以起到同等的效果,vue-resource 提供的价值和其维护成本相比并不划 算,所以决定在不久以后取消对 vue-resource 的官方推荐。已有的用户可以继续使用,但以后不再把 vue-resource 作为官方的 ajax 方案。

axios的确更优秀更稳定。

首先引入Vue和axios。

然后,编写Javascript:

Vue.prototype.$http=axios;

new Vue({

el: ‘#app’,

data: {

peps: ”

},

mounted() {

this.$http.get(‘Category.json’).then(response=>this.peps=response.data);

}

})

json数据是这样子的:

[

{

“ID”:”1″,

“name”: “地产”,

“Url”:”/Category/List/1″

},

{ “ID”:”2″,

“name”: “科技”,

“Url”:”/Category/List/2″},

{ “ID”:”3″,

“name”: “医药”,

“Url”:”/Category/List/3″},

{ “ID”:”4″,

“name”: “其他”,

“Url”:”/Category/List/4″}

]

我是希望以上的数据渲染到一个Select里面去,通过onchange直接将当前页面跳转到json数据的Url去,那么在html中只需要这样设置:

{
{pep.name}}

运行测试通过。

版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请联系我们举报,一经查实,本站将立刻删除。

发布者:全栈程序员-站长,转载请注明出处:https://javaforall.net/223081.html原文链接:https://javaforall.net

(0)
全栈程序员-站长的头像全栈程序员-站长


相关推荐

  • NTP协议解析_ntp是安全协议吗

    NTP协议解析_ntp是安全协议吗NTP(NetworkTimeProtocol,网络时间协议)是由RFC1305定义的时间同步协议,用来在分布式时间服务器和客户端之间进行时间同步。NTP基于UDP报文进行传输,使用的UDP端口号为123。使用NTP的目的是对网络内所有具有时钟的设备进行时钟同步,使网络内所有设备的时钟保持一致,从而使设备能够提供基于统一时间的多种应用。对于运行NTP的本地系统,既可以接收来自

    2022年8月31日
    2
  • 检测网络接口

    检测网络接口

    2021年12月30日
    42
  • C#常用操作类库二(ini配置文件读写)

    C#常用操作类库二(ini配置文件读写)

    2021年8月17日
    68
  • cb使用msagent

    cb使用msagent—-1、添加agent控件—-选择菜单component,importactivexcontrol——在importactivex下的列表框中选择microsoftagentcontrol2.0(version2.0),点击按钮install——在install对话框中点击按钮ok——在confirm对话框中点击按钮yes——在对话框中点击按钮ok。至此,agent控件

    2022年6月16日
    32
  • stun协议笔记一(stun格式简介)「建议收藏」

    stun协议笔记一(stun格式简介)「建议收藏」一、stun协议格式1、STUN报文头1)最高的2位必须置零,这可以在当STUN和其他协议复用的时候,用来区分STUN包和其他数据包。2)STUNMessageType字段定义了消息的类型(请求/成功响应/失败响应/指示)和消息的主方法。虽然我们有4个消息类别,但在STUN中只有两种类型的事务,即请求/响应类型和指示类型。响应类型分为成功和出错两种,用来帮助快速处理STUN…

    2022年7月17日
    12
  • poj 1845(等比数列前n项和及高速幂)

    poj 1845(等比数列前n项和及高速幂)

    2022年2月5日
    47

发表回复

您的邮箱地址不会被公开。 必填项已用 * 标注

关注全栈程序员社区公众号