mirror/element-plus
2
0
Fork 0
mirror of https://github.com/element-plus/element-plus.git synced 2024-11-21 01:02:59 +08:00
Code Issues Packages Projects Releases Wiki Activity

fix(components): fix deprecated warning (#16034)

Browse Source
This commit is contained in:
kooriookami 2024-03-04 22:06:40 +08:00 committed by GitHub
parent f71a112722
commit f8ca913a1d
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
20 changed files with 99 additions and 93 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

28
docs/examples/checkbox/button-style.vue
View File

@ -1,25 +1,16 @@
<template> <template>
<div> <div>
<el-checkbox-group v-model="checkboxGroup1" size="large"> <el-checkbox-group v-model="checkboxGroup1" size="large">
<el-checkbox-button <el-checkbox-button v-for="city in cities" :key="city" :value="city">
v-for="city in cities"
:key="city"
:label="city"
:value="city"
>
{{ city }} {{ city }}
</el-checkbox-button> </el-checkbox-button>
</el-checkbox-group> </el-checkbox-group>
</div> </div>
<div class="demo-button-style"> <div class="demo-button-style">
<el-checkbox-group v-model="checkboxGroup2"> <el-checkbox-group v-model="checkboxGroup2">
<el-checkbox-button <el-checkbox-button v-for="city in cities" :key="city" :value="city">{{
v-for="city in cities" city
:key="city" }}</el-checkbox-button>
:label="city"
:value="city"
>{{ city }}</el-checkbox-button
>
</el-checkbox-group> </el-checkbox-group>
</div> </div>
<div class="demo-button-style"> <div class="demo-button-style">
@ -27,7 +18,6 @@
<el-checkbox-button <el-checkbox-button
v-for="city in cities" v-for="city in cities"
:key="city" :key="city"
:label="city"
:value="city" :value="city"
:disabled="city === 'Beijing'" :disabled="city === 'Beijing'"
>{{ city }}</el-checkbox-button >{{ city }}</el-checkbox-button
@ -36,13 +26,9 @@
</div> </div>
<div class="demo-button-style"> <div class="demo-button-style">
<el-checkbox-group v-model="checkboxGroup4" size="small" disabled> <el-checkbox-group v-model="checkboxGroup4" size="small" disabled>
<el-checkbox-button <el-checkbox-button v-for="city in cities" :key="city" :value="city">{{
v-for="city in cities" city
:key="city" }}</el-checkbox-button>
:label="city"
:value="city"
>{{ city }}</el-checkbox-button
>
</el-checkbox-group> </el-checkbox-group>
</div> </div>
</template> </template>

6
docs/examples/date-picker/date-range.vue
View File

@ -1,8 +1,8 @@
<template> <template>
<el-radio-group v-model="size" label="size control"> <el-radio-group v-model="size" label="size control">
<el-radio-button label="large">large</el-radio-button> <el-radio-button value="large">large</el-radio-button>
<el-radio-button label="default">default</el-radio-button> <el-radio-button value="default">default</el-radio-button>
<el-radio-button label="small">small</el-radio-button> <el-radio-button value="small">small</el-radio-button>
</el-radio-group> </el-radio-group>
<div class="demo-date-picker"> <div class="demo-date-picker">
<div class="block"> <div class="block">

6
docs/examples/date-picker/enter-date.vue
View File

@ -1,8 +1,8 @@
<template> <template>
<el-radio-group v-model="size" label="size control"> <el-radio-group v-model="size" label="size control">
<el-radio-button label="large">large</el-radio-button> <el-radio-button value="large">large</el-radio-button>
<el-radio-button label="default">default</el-radio-button> <el-radio-button value="default">default</el-radio-button>
<el-radio-button label="small">small</el-radio-button> <el-radio-button value="small">small</el-radio-button>
</el-radio-group> </el-radio-group>
<div class="demo-date-picker"> <div class="demo-date-picker">
<div class="block"> <div class="block">

8
docs/examples/descriptions/sizes.vue
View File

@ -1,8 +1,8 @@
<template> <template>
<el-radio-group v-model="size"> <el-radio-group v-model="size">
<el-radio label="large">Large</el-radio> <el-radio value="large">Large</el-radio>
<el-radio>Default</el-radio> <el-radio value="default">Default</el-radio>
<el-radio label="small">Small</el-radio> <el-radio value="small">Small</el-radio>
</el-radio-group> </el-radio-group>
<el-descriptions <el-descriptions
@ -104,7 +104,7 @@ import {
User, User,
} from '@element-plus/icons-vue' } from '@element-plus/icons-vue'
const size = ref('') const size = ref('default')
const iconStyle = computed(() => { const iconStyle = computed(() => {
const marginMap = { const marginMap = {
large: '8px', large: '8px',

8
docs/examples/descriptions/vertical-list.vue
View File

@ -1,8 +1,8 @@
<template> <template>
<el-radio-group v-model="size"> <el-radio-group v-model="size">
<el-radio label="large">Large</el-radio> <el-radio value="large">Large</el-radio>
<el-radio>Default</el-radio> <el-radio value="default">Default</el-radio>
<el-radio label="small">Small</el-radio> <el-radio value="small">Small</el-radio>
</el-radio-group> </el-radio-group>
<el-descriptions <el-descriptions
@ -45,7 +45,7 @@
<script setup lang="ts"> <script setup lang="ts">
import { computed, ref } from 'vue' import { computed, ref } from 'vue'
const size = ref('') const size = ref('default')
const blockMargin = computed(() => { const blockMargin = computed(() => {
const marginMap = { const marginMap = {
large: '32px', large: '32px',

12
docs/examples/drawer/basic-usage.vue
View File

@ -1,9 +1,9 @@
<template> <template>
<el-radio-group v-model="direction"> <el-radio-group v-model="direction">
<el-radio label="ltr">left to right</el-radio> <el-radio value="ltr">left to right</el-radio>
<el-radio label="rtl">right to left</el-radio> <el-radio value="rtl">right to left</el-radio>
<el-radio label="ttb">top to bottom</el-radio> <el-radio value="ttb">top to bottom</el-radio>
<el-radio label="btt">bottom to top</el-radio> <el-radio value="btt">bottom to top</el-radio>
</el-radio-group> </el-radio-group>
<el-button type="primary" style="margin-left: 16px" @click="drawer = true"> <el-button type="primary" style="margin-left: 16px" @click="drawer = true">
@ -27,10 +27,10 @@
</template> </template>
<template #default> <template #default>
<div> <div>
<el-radio v-model="radio1" label="Option 1" size="large" <el-radio v-model="radio1" value="Option 1" size="large"
>Option 1</el-radio >Option 1</el-radio
> >
<el-radio v-model="radio1" label="Option 2" size="large" <el-radio v-model="radio1" value="Option 2" size="large"
>Option 2</el-radio >Option 2</el-radio
> >
</div> </div>

6
docs/examples/form/alignment.vue
View File

@ -1,8 +1,8 @@
<template> <template>
<el-radio-group v-model="labelPosition" label="label position"> <el-radio-group v-model="labelPosition" label="label position">
<el-radio-button label="left">Left</el-radio-button> <el-radio-button value="left">Left</el-radio-button>
<el-radio-button label="right">Right</el-radio-button> <el-radio-button value="right">Right</el-radio-button>
<el-radio-button label="top">Top</el-radio-button> <el-radio-button value="top">Top</el-radio-button>
</el-radio-group> </el-radio-group>
<div style="margin: 20px" /> <div style="margin: 20px" />
<el-form <el-form

20
docs/examples/form/basic-form.vue
View File

@ -34,16 +34,24 @@
</el-form-item> </el-form-item>
<el-form-item label="Activity type"> <el-form-item label="Activity type">
<el-checkbox-group v-model="form.type"> <el-checkbox-group v-model="form.type">
<el-checkbox label="Online activities" name="type" /> <el-checkbox value="Online activities" name="type">
<el-checkbox label="Promotion activities" name="type" /> Online activities
<el-checkbox label="Offline activities" name="type" /> </el-checkbox>
<el-checkbox label="Simple brand exposure" name="type" /> <el-checkbox value="Promotion activities" name="type">
Promotion activities
</el-checkbox>
<el-checkbox value="Offline activities" name="type">
Offline activities
</el-checkbox>
<el-checkbox value="Simple brand exposure" name="type">
Simple brand exposure
</el-checkbox>
</el-checkbox-group> </el-checkbox-group>
</el-form-item> </el-form-item>
<el-form-item label="Resources"> <el-form-item label="Resources">
<el-radio-group v-model="form.resource"> <el-radio-group v-model="form.resource">
<el-radio label="Sponsor" /> <el-radio value="Sponsor">Sponsor</el-radio>
<el-radio label="Venue" /> <el-radio value="Venue">Venue</el-radio>
</el-radio-group> </el-radio-group>
</el-form-item> </el-form-item>
<el-form-item label="Activity form"> <el-form-item label="Activity form">

24
docs/examples/form/size-control.vue
View File

@ -1,14 +1,14 @@
<template> <template>
<div> <div>
<el-radio-group v-model="size" label="size control"> <el-radio-group v-model="size" label="size control">
<el-radio-button label="large">large</el-radio-button> <el-radio-button value="large">large</el-radio-button>
<el-radio-button label="default">default</el-radio-button> <el-radio-button value="default">default</el-radio-button>
<el-radio-button label="small">small</el-radio-button> <el-radio-button value="small">small</el-radio-button>
</el-radio-group> </el-radio-group>
<el-radio-group v-model="labelPosition" label="position control"> <el-radio-group v-model="labelPosition" label="position control">
<el-radio-button label="left">Left</el-radio-button> <el-radio-button value="left">Left</el-radio-button>
<el-radio-button label="right">Right</el-radio-button> <el-radio-button value="right">Right</el-radio-button>
<el-radio-button label="top">Top</el-radio-button> <el-radio-button value="top">Top</el-radio-button>
</el-radio-group> </el-radio-group>
</div> </div>
<br /> <br />
@ -54,14 +54,18 @@
</el-form-item> </el-form-item>
<el-form-item label="Activity type"> <el-form-item label="Activity type">
<el-checkbox-group v-model="sizeForm.type"> <el-checkbox-group v-model="sizeForm.type">
<el-checkbox-button label="Online activities" name="type" /> <el-checkbox-button value="Online activities" name="type">
<el-checkbox-button label="Promotion activities" name="type" /> Online activities
</el-checkbox-button>
<el-checkbox-button value="Promotion activities" name="type">
Promotion activities
</el-checkbox-button>
</el-checkbox-group> </el-checkbox-group>
</el-form-item> </el-form-item>
<el-form-item label="Resources"> <el-form-item label="Resources">
<el-radio-group v-model="sizeForm.resource"> <el-radio-group v-model="sizeForm.resource">
<el-radio border label="Sponsor" /> <el-radio border value="Sponsor">Sponsor</el-radio>
<el-radio border label="Venue" /> <el-radio border value="Venue">Venue</el-radio>
</el-radio-group> </el-radio-group>
</el-form-item> </el-form-item>
<el-form-item> <el-form-item>

20
docs/examples/form/validation.vue
View File

@ -56,16 +56,24 @@
</el-form-item> </el-form-item>
<el-form-item label="Activity type" prop="type"> <el-form-item label="Activity type" prop="type">
<el-checkbox-group v-model="ruleForm.type"> <el-checkbox-group v-model="ruleForm.type">
<el-checkbox label="Online activities" name="type" /> <el-checkbox value="Online activities" name="type">
<el-checkbox label="Promotion activities" name="type" /> Online activities
<el-checkbox label="Offline activities" name="type" /> </el-checkbox>
<el-checkbox label="Simple brand exposure" name="type" /> <el-checkbox value="Promotion activities" name="type">
Promotion activities
</el-checkbox>
<el-checkbox value="Offline activities" name="type">
Offline activities
</el-checkbox>
<el-checkbox value="Simple brand exposure" name="type">
Simple brand exposure
</el-checkbox>
</el-checkbox-group> </el-checkbox-group>
</el-form-item> </el-form-item>
<el-form-item label="Resources" prop="resource"> <el-form-item label="Resources" prop="resource">
<el-radio-group v-model="ruleForm.resource"> <el-radio-group v-model="ruleForm.resource">
<el-radio label="Sponsorship" /> <el-radio value="Sponsorship">Sponsorship</el-radio>
<el-radio label="Venue" /> <el-radio value="Venue">Venue</el-radio>
</el-radio-group> </el-radio-group>
</el-form-item> </el-form-item>
<el-form-item label="Activity form" prop="desc"> <el-form-item label="Activity form" prop="desc">

4
docs/examples/menu/collapse.vue
View File

@ -1,7 +1,7 @@
<template> <template>
<el-radio-group v-model="isCollapse" style="margin-bottom: 20px"> <el-radio-group v-model="isCollapse" style="margin-bottom: 20px">
<el-radio-button :label="false">expand</el-radio-button> <el-radio-button :value="false">expand</el-radio-button>
<el-radio-button :label="true">collapse</el-radio-button> <el-radio-button :value="true">collapse</el-radio-button>
</el-radio-group> </el-radio-group>
<el-menu <el-menu
default-active="2" default-active="2"

4
docs/examples/pagination/more-elements.vue
View File

@ -1,8 +1,8 @@
<template> <template>
<div class="flex items-center mb-4"> <div class="flex items-center mb-4">
<el-radio-group v-model="small" class="mr-4"> <el-radio-group v-model="small" class="mr-4">
<el-radio-button :label="false">default</el-radio-button> <el-radio-button :value="false">default</el-radio-button>
<el-radio-button :label="true">small</el-radio-button> <el-radio-button :value="true">small</el-radio-button>
</el-radio-group> </el-radio-group>
<div> <div>
background: background:

6
docs/examples/space/control-size.vue
View File

@ -1,9 +1,9 @@
<template> <template>
<el-space direction="vertical" alignment="start" :size="30"> <el-space direction="vertical" alignment="start" :size="30">
<el-radio-group v-model="size"> <el-radio-group v-model="size">
<el-radio :label="'large'">large</el-radio> <el-radio value="large">Large</el-radio>
<el-radio :label="'default'">default</el-radio> <el-radio value="default">Default</el-radio>
<el-radio :label="'small'">small</el-radio> <el-radio value="small">Small</el-radio>
</el-radio-group> </el-radio-group>
<el-space wrap :size="size"> <el-space wrap :size="size">

4
docs/examples/space/fill-ratio.vue
View File

@ -2,8 +2,8 @@
<div> <div>
<div style="margin-bottom: 15px"> <div style="margin-bottom: 15px">
direction: direction:
<el-radio v-model="direction" label="horizontal">horizontal</el-radio> <el-radio v-model="direction" value="horizontal">horizontal</el-radio>
<el-radio v-model="direction" label="vertical">vertical</el-radio> <el-radio v-model="direction" value="vertical">vertical</el-radio>
</div> </div>
<div style="margin-bottom: 15px"> <div style="margin-bottom: 15px">
fillRatio:<el-slider v-model="fillRatio" /> fillRatio:<el-slider v-model="fillRatio" />

4
docs/examples/table/table-layout.vue
View File

@ -1,7 +1,7 @@
<template> <template>
<el-radio-group v-model="tableLayout"> <el-radio-group v-model="tableLayout">
<el-radio-button label="fixed" /> <el-radio-button value="fixed">fixed</el-radio-button>
<el-radio-button label="auto" /> <el-radio-button value="auto">auto</el-radio-button>
</el-radio-group> </el-radio-group>
<el-table :data="tableData" :table-layout="tableLayout"> <el-table :data="tableData" :table-layout="tableLayout">
<el-table-column prop="date" label="Date" /> <el-table-column prop="date" label="Date" />

8
docs/examples/tabs/tab-position.vue
View File

@ -1,9 +1,9 @@
<template> <template>
<el-radio-group v-model="tabPosition" style="margin-bottom: 30px"> <el-radio-group v-model="tabPosition" style="margin-bottom: 30px">
<el-radio-button label="top">top</el-radio-button> <el-radio-button value="top">top</el-radio-button>
<el-radio-button label="right">right</el-radio-button> <el-radio-button value="right">right</el-radio-button>
<el-radio-button label="bottom">bottom</el-radio-button> <el-radio-button value="bottom">bottom</el-radio-button>
<el-radio-button label="left">left</el-radio-button> <el-radio-button value="left">left</el-radio-button>
</el-radio-group> </el-radio-group>
<el-tabs :tab-position="tabPosition" style="height: 200px" class="demo-tabs"> <el-tabs :tab-position="tabPosition" style="height: 200px" class="demo-tabs">

4
packages/components/table/__tests__/table.test.ts
View File

@ -82,8 +82,8 @@ describe('Table.vue', () => {
<el-table-column label="someLabel"> <el-table-column label="someLabel">
<template #default="{ row }"> <template #default="{ row }">
<el-checkbox-group v-model="row.checkList"> <el-checkbox-group v-model="row.checkList">
<el-checkbox label="复选框 A"></el-checkbox> <el-checkbox label="复选框 A" value="复选框 A"></el-checkbox>
<el-checkbox label="复选框 B"></el-checkbox> <el-checkbox label="复选框 B" value="复选框 B"></el-checkbox>
</el-checkbox-group> </el-checkbox-group>
</template> </template>
</el-table-column> </el-table-column>

2
packages/components/table/src/filter-panel.vue
View File

@ -23,7 +23,7 @@
<el-checkbox <el-checkbox
v-for="filter in filters" v-for="filter in filters"
:key="filter.value" :key="filter.value"
:label="filter.value" :value="filter.value"
> >
{{ filter.text }} {{ filter.text }}
</el-checkbox> </el-checkbox>

2
packages/components/transfer/src/transfer-panel.vue
View File

@ -33,7 +33,7 @@
v-for="item in filteredData" v-for="item in filteredData"
:key="item[propsAlias.key]" :key="item[propsAlias.key]"
:class="ns.be('panel', 'item')" :class="ns.be('panel', 'item')"
:label="item[propsAlias.key]" :value="item[propsAlias.key]"
:disabled="item[propsAlias.disabled]" :disabled="item[propsAlias.disabled]"
:validate-event="false" :validate-event="false"
> >

16
ssr-testing/cases/radio.vue
View File

@ -1,21 +1,21 @@
<template> <template>
<div> <div>
<el-radio v-model="radio1" label="1" size="large">Option 1</el-radio> <el-radio v-model="radio1" value="1" size="large">Option 1</el-radio>
<el-radio v-model="radio1" label="2" size="large">Option 2</el-radio> <el-radio v-model="radio1" value="2" size="large">Option 2</el-radio>
</div> </div>
<div> <div>
<el-radio v-model="radio2" label="1">Option 1</el-radio> <el-radio v-model="radio2" value="1">Option 1</el-radio>
<el-radio v-model="radio2" label="2">Option 2</el-radio> <el-radio v-model="radio2" value="2">Option 2</el-radio>
</div> </div>
<div> <div>
<el-radio v-model="radio3" label="1" size="small">Option 1</el-radio> <el-radio v-model="radio3" value="1" size="small">Option 1</el-radio>
<el-radio v-model="radio3" label="2" size="small">Option 2</el-radio> <el-radio v-model="radio3" value="2" size="small">Option 2</el-radio>
</div> </div>
<div> <div>
<el-radio v-model="radio3" label="1" size="small" disabled <el-radio v-model="radio3" value="1" size="small" disabled
>Option 1</el-radio >Option 1</el-radio
> >
<el-radio v-model="radio3" label="2" size="small" disabled <el-radio v-model="radio3" value="2" size="small" disabled
>Option 2</el-radio >Option 2</el-radio
> >
</div> </div>