提交 64bb67e8 编写于 作者: D Drjnigfubo

Merge branch 'next' of https://github.com/jdf2e/nutui into next

## v3.3.3
`2022-1-18`
小程序版本依赖 Taro ^3.5.6
NutUI 非常感谢您对开源事业做出的贡献!🌷🌷🌷
本次社区贡献者 @gyt95 @thx125 @rocwong-cn
* :zap: feat(config-provider): 支持统一自定义 icon 、font-class-name、class-prefix (#2016) @thx125
* :bug: fix(numberkeyboard): type edit (#2067) @Drjingfubo
* :bug: fix(progress): component optimization (#2060) @Drjingfubo
* :bug: fix(tabs): the automatic scrolling fails while updating title bar data @gyt95
* :bug: fix(comment、ellipsis、noticebar、picker、sku): v4 bug 同步修复 @yangxiaolu1993
* :bug: fix(input、price、addresslist): v4 bug 同步修复 & v3 taro环境input使用bug @ailululu
* :bug: fix(uploader): is-deletable在列表模式下不生效 (#2062) @rocwong-cn
* :bug: fix(collapse、signature): collapse 渲染卡顿问题、signature 组件增加空值返回 (#2061) @Ymm0008
* :bug: fix: cdn minify bug 3.3.3 @richard1015
* :bug: fix: 国际化 treeshaking 修复 @richard1015
* :bug: fix(cell): desc-text-align bug @richard1015
* :bug: fix(rate): readonly state disable touch @richard1015
* :bug: fix(barrage): slot 模式优化 (#2066) @Ymm0008
* 📖 docs(tabbar): fix format (#2018) @gyt95
## v3.3.2
`2022-1-4`
......
{
"name": "@nutui/nutui",
"version": "3.3.3-beta.1",
"version": "3.3.3",
"description": "京东风格的轻量级移动端 Vue2、Vue3 组件库(支持小程序开发)",
"main": "dist/nutui.umd.js",
"module": "dist/nutui.es.js",
......
## v3.3.3
`2022-1-18`
小程序版本依赖 Taro ^3.5.6
NutUI 非常感谢您对开源事业做出的贡献!🌷🌷🌷
本次社区贡献者 @gyt95 @thx125 @rocwong-cn
* :zap: feat(config-provider): 支持统一自定义 icon 、font-class-name、class-prefix (#2016) @thx125
* :bug: fix(numberkeyboard): type edit (#2067) @Drjingfubo
* :bug: fix(progress): component optimization (#2060) @Drjingfubo
* :bug: fix(tabs): the automatic scrolling fails while updating title bar data @gyt95
* :bug: fix(comment、ellipsis、noticebar、picker、sku): v4 bug 同步修复 @yangxiaolu1993
* :bug: fix(input、price、addresslist): v4 bug 同步修复 & v3 taro环境input使用bug @ailululu
* :bug: fix(uploader): is-deletable在列表模式下不生效 (#2062) @rocwong-cn
* :bug: fix(collapse、signature): collapse 渲染卡顿问题、signature 组件增加空值返回 (#2061) @Ymm0008
* :bug: fix: cdn minify bug 3.3.3 @richard1015
* :bug: fix: 国际化 treeshaking 修复 @richard1015
* :bug: fix(cell): desc-text-align bug @richard1015
* :bug: fix(rate): readonly state disable touch @richard1015
* :bug: fix(barrage): slot 模式优化 (#2066) @Ymm0008
* 📖 docs(tabbar): fix format (#2018) @gyt95
## v3.3.2
`2022-1-4`
......
{
"name": "@nutui/nutui-taro",
"version": "3.3.3-beta.1",
"version": "3.3.3",
"description": "京东风格的轻量级移动端 Vue2、Vue3 组件库(支持小程序开发)",
"main": "dist/nutui.umd.cjs",
"module": "dist/nutui.es.js",
......
## v3.3.3
`2022-1-18`
小程序版本依赖 Taro ^3.5.6
NutUI 非常感谢您对开源事业做出的贡献!🌷🌷🌷
本次社区贡献者 @gyt95 @thx125 @rocwong-cn
* :zap: feat(config-provider): 支持统一自定义 icon 、font-class-name、class-prefix (#2016) @thx125
* :bug: fix(numberkeyboard): type edit (#2067) @Drjingfubo
* :bug: fix(progress): component optimization (#2060) @Drjingfubo
* :bug: fix(tabs): the automatic scrolling fails while updating title bar data @gyt95
* :bug: fix(comment、ellipsis、noticebar、picker、sku): v4 bug 同步修复 @yangxiaolu1993
* :bug: fix(input、price、addresslist): v4 bug 同步修复 & v3 taro环境input使用bug @ailululu
* :bug: fix(uploader): is-deletable在列表模式下不生效 (#2062) @rocwong-cn
* :bug: fix(collapse、signature): collapse 渲染卡顿问题、signature 组件增加空值返回 (#2061) @Ymm0008
* :bug: fix: cdn minify bug 3.3.3 @richard1015
* :bug: fix: 国际化 treeshaking 修复 @richard1015
* :bug: fix(cell): desc-text-align bug @richard1015
* :bug: fix(rate): readonly state disable touch @richard1015
* :bug: fix(barrage): slot 模式优化 (#2066) @Ymm0008
* 📖 docs(tabbar): fix format (#2018) @gyt95
## v3.3.2
`2022-1-4`
......
{
"name": "@nutui/nutui",
"version": "3.3.3-beta.1",
"version": "3.3.3",
"description": "京东风格的轻量级移动端 Vue2、Vue3 组件库",
"main": "dist/nutui.umd.cjs",
"module": "dist/nutui.es.js",
......
......@@ -22,7 +22,7 @@
ref="audioDemo"
>
<div class="nut-voice">
<div><nut-icon name="voice"></nut-icon></div>
<div style="display: flex"><nut-icon name="voice"></nut-icon></div>
<div>{{ duration }}"</div>
</div>
</nut-audio>
......@@ -167,6 +167,7 @@ export default createDemo({
.nut-voice {
display: flex;
justify-content: space-between;
align-items: center;
width: 100px;
height: 20px;
padding: 8px;
......
// Jest Snapshot v1, https://goo.gl/fbAQLP
exports[`basic usage 1`] = `
"<view class=\\"nut-checkbox \\"><i class=\\"nutui-iconfont nut-icon nut-icon-checked nut-checkbox__icon\\" src=\\"\\"></i>
"<view class=\\"nut-checkbox nut-checkbox--round \\"><i class=\\"nutui-iconfont nut-icon nut-icon-checked nut-checkbox__icon\\" src=\\"\\"></i>
<view class=\\"nut-checkbox__label \\"></view>
</view>"
`;
......@@ -145,3 +145,22 @@ test('should emit "update:modelValue" event when checkbox is clicked', async ()
wrapper.trigger('click');
expect(wrapper.emitted('update:modelValue')![1]).toEqual([false]);
});
test('checkbox shape test', async () => {
const wrapper = mount({
components: {
'nut-checkbox': Checkbox
},
template: `
<template>
<nut-checkbox shape="button"></nut-checkbox>
<nut-checkbox></nut-checkbox>
</template>
`
});
const items = wrapper.findAll('.nut-checkbox');
expect((items[0] as any).find('.nut-checkbox__button').exists()).toBeTruthy();
expect((items[1] as any).find('.nut-checkbox__button').exists()).toBeFalsy();
});
......@@ -49,6 +49,10 @@ export const component = (componentName: string, nutIcon: object) => {
indeterminate: {
type: Boolean,
default: false
},
shape: {
type: String,
default: 'round' // button
}
},
emits: ['change', 'update:modelValue'],
......@@ -124,6 +128,18 @@ export const component = (componentName: string, nutIcon: object) => {
);
};
const renderButton = () => {
return h(
'view',
{
class: `${componentName}__button ${pValue.value && `${componentName}__button--active`} ${
pDisabled.value ? `${componentName}__button--disabled` : ''
}`
},
slots.default?.()
);
};
const handleClick = (e: MouseEvent | TouchEvent) => {
if (pDisabled.value) return;
if (checked.value && state.partialSelect) {
......@@ -133,9 +149,9 @@ export const component = (componentName: string, nutIcon: object) => {
}
emitChange(!checked.value, slots.default?.()[0].children as string);
if (hasParent.value) {
let value = parent.value.value;
let max = parent.max.value;
let { label } = props;
const value = parent.value.value;
const max = parent.max.value;
const { label } = props;
const index = value.indexOf(label);
if (index > -1) {
value.splice(index, 1);
......@@ -161,10 +177,12 @@ export const component = (componentName: string, nutIcon: object) => {
return h(
'view',
{
class: `${componentName} ${props.textPosition === 'left' ? `${componentName}--reverse` : ''}`,
class: `${componentName} ${componentName}--${props.shape} ${
props.textPosition === 'left' ? `${componentName}--reverse` : ''
}`,
onClick: handleClick
},
[renderIcon(), renderLabel()]
[props.shape == 'button' ? renderButton() : [renderIcon(), renderLabel()]]
);
};
}
......
......@@ -128,6 +128,15 @@
>
</nut-checkboxgroup>
</nut-cell-group>
<nut-cell-group :title="translate('useShape')">
<nut-cell>
<nut-checkboxgroup v-model="checkboxgroup6">
<nut-checkbox label="1" shape="button">{{ translate('useShape') }}</nut-checkbox>
<nut-checkbox label="2" shape="button">{{ translate('useShape') }}</nut-checkbox>
</nut-checkboxgroup>
</nut-cell>
</nut-cell-group>
</div>
</template>
<script lang="ts">
......@@ -158,7 +167,8 @@ const initTranslate = () =>
checkbox: '复选框',
selectedDisable: '选中时禁用状态',
unselectDisable: '未选时禁用状态',
useGroupInte: '全选/半选/取消'
useGroupInte: '全选/半选/取消',
useShape: '按钮形状'
},
'en-US': {
basic: 'Basic usage - left and right',
......@@ -180,7 +190,8 @@ const initTranslate = () =>
checkbox: 'check box',
selectedDisable: 'Disabled when selected',
unselectDisable: 'Disabled when not selected',
useGroupInte: 'Select all / half / cancel'
useGroupInte: 'Select all / half / cancel',
useShape: 'Button shape'
}
});
export default createDemo({
......@@ -204,6 +215,7 @@ export default createDemo({
checkboxgroup3: ['2'],
checkboxgroup4: ['2'],
checkboxgroup5: [],
checkboxgroup6: [],
checkboxsource: [
{ label: '1', value: translate('combine') },
{ label: '2', value: translate('combine') },
......
......@@ -385,6 +385,7 @@ When the value changes, the `change` event will be triggered
| icon-font-class-name | Basic class name of custom icon font | String | `nutui-iconfont`
| label | Text content of the check box | String | -
| indeterminate | Whether half selection status is currently supported. It is generally used in select all operation | Boolean | `false` |
| shape `v3.3.4` | Shape, optional values:`button``round` | String | `round` |
### CheckboxGroup Props
......
......@@ -389,6 +389,7 @@ app.use(Icon);
| icon-font-class-name | 自定义 icon 字体基础类名 | String | `nutui-iconfont` |
| label | 复选框的文本内容 | String | -
| indeterminate | 当前是否支持半选状态,一般用在全选操作中 | Boolean | `false` |
| shape `v3.3.4` | 形状,可选值:`button``round` | String | `round` |
### CheckboxGroup Props
| 字段 | 说明 | 类型 | 默认值
......
......@@ -6,6 +6,14 @@
color: $checkbox-label-disable-color;
}
}
&__button {
background: $dark-background;
color: $dark-color;
&--disabled {
color: $checkbox-label-disable-color;
border: 1px solid $checkbox-label-disable-color;
}
}
}
}
.nut-checkbox {
......@@ -18,6 +26,26 @@
margin-left: 0;
}
}
&__button {
display: inline-flex;
align-items: center;
padding: $checkbox-button-padding;
font-size: $checkbox-button-font-size;
background: $checkbox-label-button-bg-color;
border-radius: $checkbox-button-border-radius;
color: $checkbox-label-color;
box-sizing: border-box;
border: 1px solid $checkbox-label-button-border-color;
&--active {
background: $checkbox-label-button-bg-active-color;
color: $checkbox-label-font-active-color;
border: 1px solid $checkbox-label-button-border-active-color;
}
&--disabled {
color: $checkbox-label-disable-color;
border: none;
}
}
&__label {
flex: 1;
margin-left: $checkbox-label-margin-left;
......
......@@ -32,7 +32,6 @@ By default, images of reviews for individual items are displayed in a single sli
:images="cmt.images"
:videos="cmt.videos"
:info="cmt.info"
:labels="labels"
@click="handleclick"
@clickImages="clickImages"
:operation="['replay']"
......@@ -45,14 +44,11 @@ By default, images of reviews for individual items are displayed in a single sli
</template>
</nut-comment>
</template>
<script>
<script lang="ts">
import { reactive, ref,onMounted } from 'vue';
export default {
setup() {
let cmt = ref({});
const labels = () => {
return '<nut-icon name="dongdong" color="#fa2c19"></nut-icon>';
};
onMounted(()=>{
fetch('//storage.360buyimg.com/nutui/3x/comment_data.json')
.then((response) => response.json())
......@@ -69,12 +65,12 @@ export default {
}
return {
cmt,
labels,
handleclick,
clickImages
};
}
}
</script>
```
:::
......@@ -112,7 +108,7 @@ The value of `headerType` allows you to set the image to be displayed in multipl
</nut-comment>
</template>
<script>
<script lang="ts">
import { reactive, ref,onMounted } from 'vue';
export default {
setup() {
......@@ -134,7 +130,7 @@ export default {
};
}
}
</script>
```
:::
......@@ -153,7 +149,7 @@ export default {
></nut-comment>
</template>
<script>
<script lang="ts">
import { reactive, ref,onMounted } from 'vue';
export default {
setup() {
......@@ -175,6 +171,7 @@ export default {
};
}
}
</script>
```
:::
......@@ -243,3 +240,15 @@ const info = [{
"like":1, // Number of likes for this comment
}]
```
### follow 对象
用于存放追评相关的信息。
```javascript
const follow = {
"days": 0, // 购买多少天后进行追评
"content": "", // 追评内容
"images": [] // 追评图片
}
```
\ No newline at end of file
......@@ -32,7 +32,6 @@ app.use(Rate);
:images="cmt.images"
:videos="cmt.videos"
:info="cmt.info"
:labels="labels"
@click="handleclick"
@clickImages="clickImages"
:operation="['replay']"
......@@ -45,14 +44,11 @@ app.use(Rate);
</template>
</nut-comment>
</template>
<script>
<script lang="ts">
import { reactive, ref,onMounted } from 'vue';
export default {
setup() {
let cmt = ref({});
const labels = () => {
return '<nut-icon name="dongdong" color="#fa2c19"></nut-icon>';
};
onMounted(()=>{
fetch('//storage.360buyimg.com/nutui/3x/comment_data.json')
.then((response) => response.json())
......@@ -69,12 +65,12 @@ export default {
}
return {
cmt,
labels,
handleclick,
clickImages
};
}
}
</script>
```
:::
......@@ -112,7 +108,7 @@ export default {
</nut-comment>
</template>
<script>
<script lang="ts">
import { reactive, ref,onMounted } from 'vue';
export default {
setup() {
......@@ -134,6 +130,7 @@ export default {
};
}
}
</script>
```
:::
......@@ -153,7 +150,7 @@ export default {
></nut-comment>
</template>
<script>
<script lang="ts">
import { reactive, ref,onMounted } from 'vue';
export default {
setup() {
......@@ -175,7 +172,7 @@ export default {
};
}
}
</script>
```
:::
## API
......@@ -247,3 +244,15 @@ const info = [{
"like":1, // 此评论的点赞数
}]
```
### follow 对象
用于存放追评相关的信息。
```javascript
const follow = {
"days": 0, // 购买多少天后进行追评
"content": "", // 追评内容
"images": [] // 追评图片
}
```
......@@ -290,10 +290,10 @@ Paused and restarted the countdown with the paused attribute
CountDown.value.reset();
};
return {
toggle,
onpaused,
onrestart,
...toRefs(state)
start,
pause,
reset,
CountDown
};
}
}
......
......@@ -293,10 +293,10 @@ app.use(CountDown);
CountDown.value.reset();
};
return {
toggle,
onpaused,
onrestart,
...toRefs(state)
start,
pause,
reset,
CountDown
};
}
}
......
......@@ -37,7 +37,7 @@ app.use(OverLay);
></nut-datepicker>
</template>
<script>
<script lang="ts">
import { ref } from 'vue';
export default {
setup(props) {
......
......@@ -2,7 +2,7 @@
<view
:class="classes"
ref="myDrag"
:id="'drag-' + refRandomId"
:id="'myDrag' + refRandomId"
class="myDrag"
@touchstart="touchStart($event)"
@touchmove.prevent="touchMove($event)"
......@@ -21,6 +21,7 @@
import { onMounted, onDeactivated, onActivated, reactive, ref, computed } from 'vue';
import { createComponent } from '@/packages/utils/create';
import requestAniFrame from '@/packages/utils/raf';
import { useTaroRect } from '@/packages/utils/useTaroRect';
const { componentName, create } = createComponent('drag');
import Taro, { eventCenter, getCurrentInstance } from '@tarojs/taro';
export default create({
......@@ -81,18 +82,12 @@ export default create({
};
});
const domElem = Taro.getSystemInfoSync();
function getInfo() {
const query = Taro.createSelectorQuery();
query
.select('#drag-' + refRandomId)
.boundingClientRect((rec: any) => {
state.elWidth = rec.width;
state.elHeight = rec.height;
state.initTop = rec.top;
state.initLeft = rec.left;
})
.exec();
// console.log(domElem.windowWidth);
async function getInfo() {
const rec = await useTaroRect(myDrag, Taro);
state.elWidth = rec.width;
state.elHeight = rec.height;
state.initTop = rec.top;
state.initLeft = rec.left;
state.screenWidth = domElem.screenWidth;
state.screenHeight = domElem.screenHeight;
......
......@@ -148,10 +148,9 @@ export default createDemo({
.demo {
padding-bottom: 30px !important;
// .interstroll-list {
// padding: 0 10px;
// background: rgba(251, 248, 220, 1);
// color: #d9500b;
// }
.interstroll-list {
background: rgba(251, 248, 220, 1);
color: #d9500b;
}
}
</style>
......@@ -61,7 +61,7 @@
<slot name="rightIcon"></slot>
</template>
<template v-else-if="closeMode">
<nut-icon type="cross" :color="color" size="11px"></nut-icon>
<nut-icon v-bind="$attrs" name="close" v-if="closeMode" :color="color" size="11px"></nut-icon>
</template>
</view>
</view>
......
......@@ -56,8 +56,8 @@
</template>
<view class="go" @click="!slots.rightIcon && handleClickIcon()">
<slot name="rightIcon">
<nut-icon type="cross" v-if="closeMode" :color="color" size="11px"></nut-icon>
<slot name="right-icon">
<nut-icon v-bind="$attrs" name="close" v-if="closeMode" :color="color" size="11px"></nut-icon>
</slot>
</view>
</view>
......
......@@ -166,15 +166,15 @@ columns 属性可以通过二维数组的形式配置多列选择。
```html
<template>
<nut-cell title="请选择城市" :desc="desc" @click="()=>{show=true}"></nut-cell>
<nut-picker
v-model="selectedTime"
v-model:visible="show"
:columns="multipleColumns"
title="城市选择"
@confirm="confirm"
@change="change"
>
</nut-picker>
<nut-picker
v-model="selectedTime"
v-model:visible="show"
:columns="multipleColumns"
title="城市选择"
@confirm="confirm"
@change="change"
>
</nut-picker>
</template>
<script>
import { ref } from 'vue';
......@@ -207,10 +207,11 @@ columns 属性可以通过二维数组的形式配置多列选择。
console.log(selectedValue);
};
return {show,desc,columns,change, confirm, selectedTime};
return {show,desc,change, confirm, selectedTime,multipleColumns};
}
};
</script>
```
:::
......@@ -315,7 +316,7 @@ columns 属性可以通过二维数组的形式配置多列选择。
@confirm="confirm"
></nut-picker>
</template>
<script>
<script lang="ts">
import { ref, onMounted } from 'vue';
export default {
setup(props) {
......@@ -362,7 +363,7 @@ Picker 组件在底部和顶部分别设置了插槽,可进行自定义设置
<nut-cell title="请选择截止时间" :desc="desc" @click="()=>{show=true}"></nut-cell>
<nut-picker
v-model:visible="show"
:columns="asyncColumns"
:columns="effectColumns"
title="日期选择"
@confirm="confirm"
>
......
<template>
<view class="nut-sku-header">
<img :src="goods.imagePath" />
<img class="nut-sku-header-img" :src="goods.imagePath" />
<view class="nut-sku-header-right">
<template v-if="getSlots('sku-header-price')">
......
......@@ -509,6 +509,14 @@ $checkbox-label-margin-left: 15px !default;
$checkbox-label-font-size: 14px !default;
$checkbox-icon-font-size: 18px !default;
$checkbox-icon-disable-color2: $help-color !default;
$checkbox-button-padding: 5px 18px !default;
$checkbox-button-font-size: 12px !default;
$checkbox-button-border-radius: 15px !default;
$checkbox-label-button-bg-color: #f6f7f9 !default;
$checkbox-label-button-border-color: #f6f7f9 !default;
$checkbox-label-button-bg-active-color: rgba($primary-color, 0.05) !default;
$checkbox-label-button-border-active-color: $primary-color !default;
$checkbox-label-font-active-color: $primary-color !default;
//radio
$radio-label-font-color: #1d1e1e !default;
......
......@@ -440,6 +440,14 @@ $checkbox-label-margin-left: 15px !default;
$checkbox-label-font-size: 14px !default;
$checkbox-icon-font-size: 18px !default;
$checkbox-icon-disable-color2: $checkbox-icon-disable-color !default;
$checkbox-button-padding: 5px 18px !default;
$checkbox-button-font-size: 12px !default;
$checkbox-button-border-radius: 15px !default;
$checkbox-label-button-bg-color: #f6f7f9 !default;
$checkbox-label-button-border-color: #f6f7f9 !default;
$checkbox-label-button-bg-active-color: rgba($primary-color, 0.05) !default;
$checkbox-label-button-border-active-color: $primary-color !default;
$checkbox-label-font-active-color: $primary-color !default;
//radio
$radio-label-font-color: #1d1e1e !default;
......
......@@ -416,6 +416,14 @@ $checkbox-label-margin-left: 8px !default;
$checkbox-label-font-size: 16px !default;
$checkbox-icon-font-size: 20px !default;
$checkbox-icon-disable-color2: $help-color !default;
$checkbox-button-padding: 5px 18px !default;
$checkbox-button-font-size: 12px !default;
$checkbox-button-border-radius: 15px !default;
$checkbox-label-button-bg-color: #f6f7f9 !default;
$checkbox-label-button-border-color: #f6f7f9 !default;
$checkbox-label-button-bg-active-color: rgba($primary-color, 0.05) !default;
$checkbox-label-button-border-active-color: $primary-color !default;
$checkbox-label-font-active-color: $primary-color !default;
//radio
$radio-label-font-color: rgba(0, 0, 0, 0.85) !default;
......
......@@ -440,6 +440,14 @@ $checkbox-label-margin-left: 15px !default;
$checkbox-label-font-size: 14px !default;
$checkbox-icon-font-size: 18px !default;
$checkbox-icon-disable-color2: $help-color !default;
$checkbox-button-padding: 5px 18px !default;
$checkbox-button-font-size: 12px !default;
$checkbox-button-border-radius: 15px !default;
$checkbox-label-button-bg-color: #f6f7f9 !default;
$checkbox-label-button-border-color: #f6f7f9 !default;
$checkbox-label-button-bg-active-color: rgba($primary-color, 0.05) !default;
$checkbox-label-button-border-active-color: $primary-color !default;
$checkbox-label-font-active-color: $primary-color !default;
//radio
$radio-label-font-color: #1d1e1e !default;
......
......@@ -50,6 +50,8 @@
<nut-checkbox label="2">组合复选框</nut-checkbox>
<nut-checkbox label="3">组合复选框</nut-checkbox>
<nut-checkbox label="4">组合复选框</nut-checkbox>
<nut-checkbox label="5" shape="button">组合复选框</nut-checkbox>
<nut-checkbox label="6" shape="button">组合复选框</nut-checkbox>
</nut-checkboxgroup>
</nut-cell>
<nut-cell>
......@@ -106,6 +108,14 @@
<nut-cell><nut-checkbox label="4">组合复选框</nut-checkbox></nut-cell>
</nut-checkboxgroup>
</nut-cell-group>
<nut-cell-group title="按钮形状">
<nut-cell>
<nut-checkboxgroup v-model="checkboxgroup6">
<nut-checkbox label="1" shape="button">按钮形状</nut-checkbox>
<nut-checkbox label="2" shape="button">按钮形状</nut-checkbox>
</nut-checkboxgroup>
</nut-cell>
</nut-cell-group>
</div>
</template>
<script lang="ts">
......@@ -130,6 +140,7 @@ export default {
checkboxgroup3: ['2'],
checkboxgroup4: ['2'],
checkboxgroup5: [],
checkboxgroup6: [],
checkboxsource: [
{ label: '1', value: '组合复选框' },
{ label: '2', value: '组合复选框' },
......
Markdown is supported
0% .
You are about to add 0 people to the discussion. Proceed with caution.
先完成此消息的编辑!
想要评论请 注册