bwadmin/FileCollect
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

home1022

Browse Source
This commit is contained in:
bwstudio
2025-10-22 08:19:00 +08:00
parent 467b04e5b0
commit 97fbfe08d7
6040 changed files with 529099 additions and 9685 deletions
Download Patch File Download Diff File Expand all files Collapse all files
pages/componentsC/codeInput/codeInput.nvue
+153
View File
@@ -0,0 +1,153 @@
<template>
<view class="u-page">
<view class="u-demo-block">
<text class="u-demo-block__title">基础使用</text>
<view class="u-demo-block__content">
<u-code-input
v-model="value1"
:maxlength="4"
@change="change"
@finish="finish"
></u-code-input>
</view>
</view>
<view class="u-demo-block">
<text class="u-demo-block__title">横线模式</text>
<view class="u-demo-block__content">
<u-code-input
v-model="value2"
mode="line"
:maxlength="4"
:bold="true"
></u-code-input>
</view>
</view>
<view class="u-demo-block">
<text class="u-demo-block__title">设置长度</text>
<view class="u-demo-block__content">
<u-code-input
v-model="value3"
:maxlength="6"
></u-code-input>
</view>
</view>
<view class="u-demo-block">
<text class="u-demo-block__title">设置间距</text>
<view class="u-demo-block__content">
<u-code-input
v-model="value4"
mode="box"
:space="0"
:maxlength="4"
></u-code-input>
</view>
</view>
<view class="u-demo-block">
<text class="u-demo-block__title">细边框</text>
<view class="u-demo-block__content">
<u-code-input
v-model="value5"
mode="box"
:space="0"
:maxlength="4"
hairline
></u-code-input>
</view>
<view
class="u-demo-block__content"
style="margin-top: 10px;"
>
<u-code-input
v-model="value6"
mode="line"
:space="10"
:maxlength="4"
hairline
></u-code-input>
</view>
</view>
<view class="u-demo-block">
<text class="u-demo-block__title">调整颜色</text>
<view class="u-demo-block__content">
<u-code-input
v-model="value7"
mode="box"
:space="0"
:maxlength="4"
hairline
color="#f56c6c"
borderColor="#f56c6c"
></u-code-input>
<view class="u-demo-block__content" style="margin-top: 10px;">
<u-code-input
v-model="value10"
mode="line"
size="30"
:maxlength="4"
hairline
color="#3c9cff"
borderColor="#3c9cff"
></u-code-input>
</view>
</view>
</view>
<view class="u-demo-block">
<text class="u-demo-block__title">点模式</text>
<view class="u-demo-block__content">
<u-code-input
v-model="value8"
mode="box"
dot
:space="0"
:maxlength="4"
hairline
></u-code-input>
</view>
</view>
<view class="u-demo-block">
<text class="u-demo-block__title">预置内容</text>
<view class="u-demo-block__content">
<u-code-input
v-model="value9"
mode="box"
:space="0"
:maxlength="4"
hairline
fontSize="17"
></u-code-input>
</view>
</view>
</view>
</template>
<script>
export default {
data() {
return {
value1: '',
value2: '',
value3: '',
value4: '',
value5: '',
value6: '',
value7: '',
value8: '',
value9: '123',
value10: '34'
}
},
methods: {
change(e) {
console.log('change', e);
},
finish(e) {
console.log('finish', e);
}
},
}
</script>
<style lang="scss">
</style>