1.开发注意
建议是把大图片放在public里面,小图片放在src/assets里面
因为webpack会抽取图片资源,把大的弄成一个请求加载,
小的图片会当做icon,会打包成base64的,把图片压缩到base64,就少了一个请求,这个是最优的。
在main.js,router.js中最好是把插件放在上面,组件放在下面
Vuex:
首先是组件里面的一个点击事件-》通过dispatch派发一个Actions,actions会提交一个commit到Mutations,Mutations会自动提交状态到State,从而状态会重新选择我们这个视图,当我们状态改变的时候呢,跟组件有延迟的话,那就要用computed计算属性
*
*
*
*
*
--路由动态取餐
写法一:this.$router.push(`/detail?id=${this.$route.query.id}`);
写法二:this.$router.push({path:'detail',query:{id:123}})
*
this.$router.push({ name:'router1',params: { id: status ,id2: status3},query: { queryId: status2 }});
<h1>从这个路由传参到别的路由</h1>
<router-link :to="{ name:'router1',params: { id: status ,id2: status3},query: { queryId: status2 }}" >
router-link跳转router1
</router-link>
*
this.$router.push('')
*
components是放组件的 app.veu是根组件,只能放<router-view />
在src,新建一个文件夹util,存放公共方法的、
在src,新建一个文件夹storage,是存放local,session,cookie的值的
yarn add vue-lazyload element-ui node-sass sass-loader vue-aw
esome-swiper vue-axios vue-cookie --save-dev
import Vue *from* "vue";
import Router *from* "vue-router";
Vue.use(Router); *
$emit():子组件向父组件传值
比如:@click="$emit('submit')",因为submit是自定义事件,
所以在父元素中接收:@submit="goToCart"
然后在methods方法中,定义goToCart事件
注意vue动画:enter必须是要放在动画的后面
&.slide-enter-active {
top: 0;
}
&.slide-leave-active {
top: -100%;
}
&.slide-enter {
top: -100%;
}
在浏览器勾选这个,Disable cache,就是防止页面被缓存
每次请求都是会刷新的,这样子才不会
*
*
*
2.代码片段配置
{
"eLink": {
"prefix": "el-link",
"body": ["<el-link href=\"#\" type=\"primary\">$1</el-link>"],
"description": "el-link"
}
}
这里面$1,是代码光标显示的位置