vant滑动插件
先在main.js全局 引入UI库import Vant from 'vant';import 'vant/lib/index.css';Vue.use(Vant);<template>这个是引入的插件<van-popup v-model="show" position="bottom"><van-p...
先在main.js全局 引入UI库
import Vant from 'vant';
import 'vant/lib/index.css';
Vue.use(Vant);
<template>
这个是引入的插件
<van-popup v-model="show" position="bottom">
<van-picker
:columns="columns"
show-toolbar
title="标题"
@cancel="onCancel"
@confirm="onConfirm"/>
</van-popup>
<li @click="showMt">
<P>{{ jyTitle }}</P>//{{ jyTitle }}是插入到p标签
<img src="/static/images/lifebot_06.gif" alt>
</li>
</template>
<script>
import { Picker, Toast } from "vant";
export default {
data() {
return {
show: false,
columns: ["BSPC/QA", "BSPC/QB", "BSPC/QC", "BSPC/QD", "BSPC/QE"],
jyTitle:'',
};
},
created(){
this.jyTitle=this.columns[0]
},
methods: {
showMt() {
this.show = !this.show;
},
goreferral() {
this.$router.push("/referral");
},
onCancel(){
this.show=false;
},
onConfirm(picker, value, index){
this.show=false;
this.jyTitle = picker;
}
}
};
更多推荐
所有评论(0)