在vue中点餐小程序如何让菜单栏随州滑动而被选中
在vue中点餐小程序让菜单栏随州滑动而被选中：小程序、公众号和APP是高州三种不同的场景，三者优劣各显，公众号主要是很好地契合了社交的场景，能满足通过内容与用户对接、沟通，但不能完成大量的用户获取。
将点餐小程序添加到微信自带的“附近小程序”。这是一个非常大的流量入口，是实体店重要的引流方式，可以让你的门店引流范围扩大到5公里。只要用户用微信，离你的店铺不远，打开了附近小程序就能看见你的小程序，很有可能就会点击进入体验。
主要功能：
分镜头：通过点按改变视频的分镜数实现简易的纳梁剪辑效洞念运果，而剪辑能够让视频传达更多的信息。
实时滤镜：由电影调色专家调制的12款滤镜供选择，切换至前置摄像头会出现自然的自拍美颜功能。款手绘贴纸，还可以编辑贴纸的出现时间。
自由画幅设置：支持1:1、16:9、2.39:1 三种画幅的视频拍摄。
分享：支持分享至社交网络。
vue中获取滚动高度或指定滚动到某位置
1.点击某个标签，滚动到某个具体位置
switchHeight(num) {
this.selectNum = num;
者滑 if (num == 0) {
document.getElementById("identifer_one").scrollIntoView();
} else {
document.getElementById("hotel_two").scrollIntoView();
}
},
2.获取滚动高度，
首先要先写监听事件：
mounted() {
window.addEventListener("scroll", this.handleScroll, true); //监听滚动事件
},
处理监听事件：e.target.scrollTop是目标对象贺返的滚动高度首拍腊
handleScroll(e) {
let serviceTop = 44;
let hotelTop = 344;
if (e.target.scrollTop 44 e.target.scrollTop 344) {
this.selectNum = 0;
}
if (e.target.scrollTop 344) {
this.selectNum = 1;
}
}
},
vue滑动选择器(一键开启时间选择器)
# vue滑动选择器(一键开启时间选择器)(移动端和PC端都能使用)
### 先来唤则穗张效果图
安装 npm install time_check_jiangji
引入 import Time from 'time_check_jiangji'
## 直接上干货，demo
```javascript
template
div class="App"盯改
div @click="timeShow = true"点击显示Time组件/div
Time v-if="timeShow" :cancleFn="cancleFn" :time="true" :defaultValue="[2019, 6, 5, '上午', '随便2']" :arr="[['上午', '下午'], ['随便1', '随便2']]" @click="clickFn" :arrayFirstdayAndLastday="['2012.6.8', '2019.6.10']" :stylBtn="{'color': '#00ffff'}" /
/div
/template
script
import Time from 'time_check_jiangji'
export default {
name: 'App',
components: {
Time
},
data() {
return {
timeShow: true
};
},
methods: {
clickFn (e) {
console.log(e)
this.timeShow = false
},
cancleFn () {
console.log('取消')
this.timeShow = false
}
}
};
/script
```
下面再来一个说明
```javascript
@click="clickFn"
是点击确认按钮的触发的函数 接受一个参数(数组类型)，是当前的值
(例如[2019, 6, 5, "上午", "随便2"])
:cancleFn="cancleFn" (特别注意，是:cancleFn不是@cancleFn，是: 不是@)
是点击取消按钮触发的函和卜数，不传则不显示取消按钮(非必传)
:defaultValue="[2019, 6, 5, "上午", "随便2"]"
是回显值(一维数组，非必传，传了能回显) 数据类型注意要对应上
:time="true"
开启年月日的时间选择模式(只能选择三年内的日期，非必传)
:arr="[['上午', '下午'], ['随便1', '随便2']]"
传入二维数组(非必传)
如果:time="true" 那么前三列是时间(年月日)，第四列是['上午', '下午']，第五列是['随便1', '随便2']
如果:time="false"或者未传， 第1列是['上午', '下午']，第2列是['随便1', '随便2']
:arrayFirstdayAndLastday="['2016.6-8', '2019-6.10']" (日期用逗号(.)或者一杠(-)隔开都行)
arrayFirstdayAndLastday是一维数组，数组长度必须是2，数组长度必须是2，数组长度必须是2
第一项是最早的显示时间，第二项是最晚的显示时间
['2016.6.8', '2019.6.10'] 那么最早显示时间是2016年6月8号，最晚时间是2019年6月10号
:stylBtn="{'color': '#00ffff'}"
是按钮这一栏的行内样式
```
附上github地址