Vue——URl重定向+使用Ajax库-axios
1. URl重定向重定向指令:redirect路由别名:aliasApp.vue<p><router-link to="/">Home</router-link><router-link to=&quo
·
1. URl重定向
重定向指令:redirect
路由别名:alias
App.vue
<p>
<router-link to="/">Home</router-link>
<router-link to="about/">About</router-link>
<router-link to="/player/1">player</router-link>
<router-link to="/curry">Curry</router-link>
</p>
router/index.js
{
path: '/about',
name: 'About',
component: About,
alias: 'aboutme'
},
{
path: '/curry',
redirect: 'player/1'
// redirect: {name :'About'}
// redirect: '/about'
}
结果 点击切换
2. 使用Ajax库-axios
为网页增加远程数据存取能力(Ajax)
HTTP库axios(浏览器 or Node.js) 服务端开发也能使用
http://github.com/axios/axios
$ cd myweb
进入项目目录
$npm install --save --save-exact axios vue-axios
精确版本号
import axios from ‘axios’
import VueAxios from ‘vue-axios’
Vue.use(VueAxios, axios) 注册到vue的全局组件中
拷贝到src目录下的main.js文件中
注册组件
1.
<pre>{{content}}</pre>
在src中的componebts的HelloWorld.vue中添加
可以把默认不需要的删除
2.
export default{
name:"HelloWorld",
data(){
return{
content:""
};
},
mounted(){
this.axios.post("http://api.komavideo.com/news/list").then(body => {
this.content = body.data;
});
}
};
替换原本的文件
。。。。。。。。。。。。。
中间报错了
解决办法
最后结果显示 能够得到该网页爬取的数据
更多推荐
已为社区贡献2条内容
所有评论(0)