vue之貓眼json數(shù)據(jù)的獲取直接用于自己的vue項(xiàng)目中

遇到問(wèn)題總結(jié):

加載不出貓眼數(shù)據(jù),無(wú)法調(diào)用,數(shù)據(jù)被限制

貓眼電影圖片的拼接及刪除問(wèn)題

swiper的迷幻坑**

首先來(lái)說(shuō)一下第一問(wèn)題 加載不出貓眼數(shù)據(jù),無(wú)法調(diào)用,數(shù)據(jù)被限制:
這個(gè)是應(yīng)用要設(shè)置代理,因?yàn)槭强缬蛘?qǐng)求

module.exports = {devServer: {proxy: { //代理'/ajax': { //請(qǐng)求方式target: 'https://m.maoyan.com',//網(wǎng)絡(luò)地址// ws:true,changeOrigin: true}// '/foo': {// target: '<other_url>'// }}} } 首先創(chuàng)建一個(gè)vue的config.js代理文件然后把代碼填入,

第二個(gè)問(wèn)題貓眼圖片的拼接問(wèn)題:
貓眼電影圖片json數(shù)據(jù)與它網(wǎng)頁(yè)用的圖片不一致需要去去掉/w.h,添加@123w__233h的一個(gè)圖像大小的設(shè)置( 這個(gè)思路是遍歷數(shù)組然后刪除圖片鏈接的多余的字符串,會(huì)出現(xiàn)一個(gè)數(shù)組里倆個(gè)字符串,然后在[0]和[1]的拼接然后在送回給原來(lái)的數(shù)組 上代碼)

mounted () {axios.get('/ajax/movieOnInfoList').then(res => {this.datalist = res.data.movieListfor (let index1 = 0; index1 < this.datalist.length; index1++) {const element1 = this.datalist[index1]var image = element1.img.split('w.h/')var zer = image[0] + image[1] + '@160w_220h_1e_1c'element1.img = zer// console.log(element1, '44444')// this.datalist.push(element1)console.log(zer, '22222')}console.log(this.datalist, 6777)})},

這第三個(gè)坑屬實(shí)是讓我非常難受swiper的圖片輪播，我看視頻是在數(shù)據(jù)的class標(biāo)簽里另起了一個(gè)屬性我就用了這個(gè)屬性創(chuàng)建了 還有就是版本的問(wèn)題你是把swiper的css和js導(dǎo)入了但是就是沒(méi)有分頁(yè)器原因竟然是沒(méi)導(dǎo)入

import Swiper, { Pagination, Navigation } from 'swiper' import 'swiper/swiper-bundle.min.css' Swiper.use([Pagination, Navigation])//這是就是分頁(yè)器沒(méi)顯示的原因

還有就是class名字屬性一定要一樣

<div class='swiper-container'>//要用swiper-container new Swiper('.swiper-container', //組件名字也要用這個(gè)倆個(gè)一定要一樣

貓眼熱門(mén)電影的json數(shù)據(jù)數(shù)api(慢些造作小心ip被封)

https://m.maoyan.com/ajax/movieOnInfoList

總結(jié)

以上是生活随笔為你收集整理的vue之猫眼json数据的获取直接用于自己的vue项目中,swiper轮播插件的坑的全部?jī)?nèi)容，希望文章能夠幫你解決所遇到的問(wèn)題。

如果覺(jué)得生活随笔網(wǎng)站內(nèi)容還不錯(cuò)，歡迎將生活随笔推薦給好友。