商品区域goods.vue
2017-09-09技术点:
定义了2个wrapper,分别是menu-wrapper和foods-wrapper,对应当前页面的架构,左右两边的区域
v-if和v-show的选择使用
v-for传递索引
vue传递原生事件$event
使用stylus的mixin处理一些border和img的问
...
stylus相关和1像素边框问题
1像素边框问题1像素边框问题其实就是Dpr的比例问题,例如 Retina屏设置1px边框，实际显示2px,因为Dpr是2,所以会显示为2px
目前这里用的是伪元素 + transform 实现:
伪元素:总结伪类与伪元素
12::after 在某元素之后插入某些内容::before 在某元素之前插入
...
商品详情页food.vue
主体结构html代码
1234567<template> <transition name="move"> <!--要实现这个商品详情页的内容滚动,所以需要有一个显示标志和一个dom绑定--> <div v-show&#x
...
商家页面seller.vue
主体结构html代码
1234567891011121314151617181920212223<div class="seller" ref="seller"> <div class="sell
...
星星组件star.vue
整个流程是:
绑定星星类型的class(48,36,24尺寸),使用starType
使用class来显示星星,有3种类型,全星,半星,无星,使用star-item代表星星本身,然后分别使用on,off,half代表三种不同类型的星星
一个span代表一个星星项目,并且使用v-for循环将星星项目
...