跨域
- 同源策略
浏览器的一种安全协议,只要协议、主机、端口号,有一个不一致就会产生同源策略。 - 解决跨域问题
后台直接放开
需要后端配合
优点:方便
缺点:不安全
JSONP
利用script标签不受同源策略影响,需要后端配合
配置代理
在vue.config.js文件中配置
//配置代理
devServer: {
proxy: {
//代理名称
'/api': {
target: 'https://course.myhope365.com/api',
changeOrigin: true, //是否跨越
pathRewrite: { //路径重写
'^/api': '' //正则表达式以/api开头
}
}
}
}
双层v-for循环
<div v-for="(item,index) in titles" :key="index">
<h3>
{{ index + 1 }}.{{ item.sectionName }}
<button>
<a-icon type="cloud-download"/>
下载
</button>
</h3>
<ul>
<li v-for="(a,b) in item.subSections" :key="b" class="contents">
{{ index + 1 }}-{{ b + 1 }} {{ a.sectionName }}
<a-icon type="play-circle"/>
</li>
</ul>
</div>
注意第二层v-for中的item是第一层循环的每一个元素