Git Bash 中 解决 Ctrl+C 端口一直占用问题
tskill node
在vue组件中使用axios
// 方法一:直接在.vue文件中引入使用
// 在.vue文件中使用
<script>
import axios from 'axios';
export default {
name: 'news',
data () {
return {
}
},
methods: {
getNewsFn(){
axios.get(this.dataURL + '/getNews').then((news) => {
this.news = news.data;
}
).catch((err) => {
console.log(err);
}
);
}
}
}
</script>
// 方法二:注册为全局的函数
// 首先在main.js文件中引入
import axios from '../node_modules/axios';
Vue.prototype.$axios = axios;
new Vue({
el: '#app',
router,
store,
axios,
echarts,
template: '<App/>',
components: { App }
});
其次在.vue文件中使用
defaultData(){
let _this = this;
_this.$axios.get('http://' + _this.$store.state.defaultHttp + '?action_type=comp_news&comp_id=' + _this.$store.state.compValue + '&offset=0&len=' + _this.pageNum, {}, {
headers: {}
}).then(function (response) {
}).catch(function (response) {
console.log(response);
});
}
Api及跨域
知乎日报Apihttps://news-at.zhihu.com/api/4/news/latest
解决跨域问题
- 解决办法1
谷歌浏览器或者QQ浏览器安装一个插件Allow-Control-Allow-Origin: *
- 解决办法2
嵌套，让别人做转发
嵌套转发https://bird.ioliu.cn/v1?url=https://news-at.zhihu.com/api/4/news/latest
解决访问api图片403禁止访问问题
使用方法：把api图片连接提取出来，使用下面方法过滤
getImage(url){
// console.log(url);
// 把现在的图片连接传进来，返回一个不受限制的路径
if(url !== undefined){
return url[0].replace(/http\w{0,1}:\/\/p/g,'https://images.weserv.nl/?url=p');
}
}
Html结构
<div>图片：<img :src="getImage(item.images)" :alt="item.title"></div>