96 lines
2.3 KiB
Vue
96 lines
2.3 KiB
Vue
<template>
|
|
<ciy-header ref="header" title="ciy-slider组件"></ciy-header>
|
|
<view>
|
|
<view class="ciy-card">
|
|
<view class="title">数字滑动框</view>
|
|
<view class="content">
|
|
暂未优化。<br/>
|
|
</view>
|
|
</view>
|
|
<form @submit="submitlog">
|
|
<view class="ciy-form">
|
|
<label>v-model绑定</label>
|
|
<view>
|
|
<ciy-slider name="ciy1" v-model="formvalue" @change="chglog('change', $event)"></ciy-slider>
|
|
</view>
|
|
</view>
|
|
<view class="ciy-form">
|
|
<label>value绑定</label>
|
|
<view>
|
|
<ciy-slider :value="formvalue" name="ciy2" @change="chglog('change', $event)"></ciy-slider>
|
|
</view>
|
|
</view>
|
|
<view class="ciy-form">
|
|
<label>禁用</label>
|
|
<view>
|
|
<ciy-slider disabled :value="formvalue" name="ciy3" @change="chglog('change', $event)"></ciy-slider>
|
|
</view>
|
|
</view>
|
|
|
|
<view class="txt-center px4 py4">
|
|
<button class="btn" form-type="submit">提交表单</button>
|
|
<button class="btn" @tap="formvalue=2">改变值</button>
|
|
</view>
|
|
<view class="ciy-card formcard" v-if="formdata">
|
|
<view class="content">
|
|
<view v-html="tobr(formdata, true)" class="formdata"></view>
|
|
</view>
|
|
</view>
|
|
</form>
|
|
|
|
<view class="ciy-card">
|
|
<view class="title">属性</view>
|
|
<view class="content">
|
|
<view class="prp">name,value,v-model</view>
|
|
<view class="hr"></view>
|
|
<view class="prp">disabled</view>
|
|
<view class="tip">
|
|
禁止选择。<br />
|
|
默认 false
|
|
</view>
|
|
</view>
|
|
</view>
|
|
<view class="ciy-card">
|
|
<view class="title">方法</view>
|
|
<view class="content">
|
|
无
|
|
</view>
|
|
</view>
|
|
<view class="ciy-card">
|
|
<view class="title">事件</view>
|
|
<view class="content">
|
|
<view class="evt">@change, update:modelValue</view>
|
|
<view class="tip">
|
|
数值变更事件<br />
|
|
from: init,input<br/>
|
|
</view>
|
|
<view class="hr"></view>
|
|
<view class="log" v-for="(item, index) in eventlog" :key="index">
|
|
<text class="code">{{eventlog.length - index}}</text>
|
|
{{item}}
|
|
</view>
|
|
</view>
|
|
</view>
|
|
<view class="hr"></view>
|
|
</view>
|
|
</template>
|
|
|
|
<style>
|
|
@import '@/pages/demo/zdemo.css';
|
|
</style>
|
|
|
|
<script>
|
|
import zmixin from '@/pages/demo/zmixin.js';
|
|
export default {
|
|
mixins: [zmixin],
|
|
data() {
|
|
return {
|
|
formvalue: ''
|
|
}
|
|
},
|
|
onLoad() {
|
|
},
|
|
methods: {
|
|
}
|
|
}
|
|
</script> |