摘要:
在组件中要使用vuex的状态,取值表达式会很长 处理方式1:使用计算属性 、 方式二:可以使用vuex-mapStore来处理,列表中可以是多个状态,只要是vuex管理的状态都可以在这里使用 以上方法,虽然可以很容易使用vuex里面的状态,但是当有自定义的计算属性的时候,无法融合 方法3:在计算属性 阅读全文
摘要:
异步处理逻辑 应用场景: 当这样来回切换的时候,每一次切换都会请求对应的接口,会对后端接口造成不必要的压力,而且如果用户网络不好的话,请求接口会变慢,造成不好的用户体验 解决办法:当切换到对应页面的时候,判断是否有对应组件的数据,如果有,则直接从store中获取数据渲染渲染,如果没有,则通过acti 阅读全文
摘要:
上一篇的操作,虽然可以达到效果,但是有很大风险,vuex中的状态是共享的,所有组件都可以使用和改变,但状态改变后,无法确定是哪个组件中的事件使vuex中的状态改变了,所以需要一个第三方的东西来统一处理,Mutations 同步处理逻辑 vue devtools安装和使用: 安装和说明:https:/ 阅读全文
摘要:
VuexVuex是在中大型项目中,用来管理一些变量的。因为如果项目比较大,一些数据在各个页面中可能需要进行交替使用,如果数据量比较大,通过params或者query的方式不太方便。这时候就可以使用Vuex来管理这些数据。 官方文档:https://vuex.vuejs.org/zh/guide/ 安 阅读全文
摘要:
获取影院数据 渲染 要使用better-scroll实现的效果 下载Better-Scroll库:cnpm install --save better-scroll 使用better-scroll 动态设置div高度 cinema <template> <div class="cinema" :st 阅读全文
摘要:
实现点击电影信息跳转到详情页面 获取传递给detail组件的参数,去请求接口获取数据 渲染数据 图片css和渲染图片 <template> <div v-if="filminfo"> <img :src="filminfo.poster" class="poster"> <h2>{{ filminf 阅读全文
摘要:
先实现film-header导航 实现film-header组件 FilmHeader组件 <template> <div> <ul> <router-link to="/film/nowplaying" tag="li" active-class="isActive">正在热映</router-l 阅读全文
摘要:
在预留的轮播位置,实现真正的轮播 安装swiper组件 swiper的css所在的位置 老版有dist文件夹,位置为:swiper/dist/css/swiper.css新版没有dist文件夹,位置为:swiper/swiper-bundle.css 实现swiper组件 <template> <d 阅读全文
摘要:
nowplaying页面局部css <style lang="scss" scoped> ul { li { padding: 10px; overflow: hidden; img { float: left; width: 100px; } } }</style> 由效果看,导演是一个数组,数组 阅读全文
摘要:
一:数据请求 nowplayingurl: 'https://m.maizuo.com/gateway?cityId=110100&pageNum=1&pageSize=10&type=1&k=8629683',headers: { 'X-Client-Info': '{"a":"3000","ch 阅读全文