vue3+element-plus 表格默认选中数据
element
A Vue.js 2.0 UI Toolkit for Web
项目地址:https://gitcode.com/gh_mirrors/eleme/element
免费下载资源
·
html:
<template>
<el-table ref="multipleTableRef" row-key="id" height="500" :header-cell-style="{ background: '#F5F6FA' }" :cell-style="{ padding: '2px' }" :row-style="{ height: '36px' }" v-loading="state.loading" :data="searchstate.list" border >
<el-table-column type="selection" width="55" align="center" />
<el-table-column label="字段名" prop="chinaFieldName" />
</el-table>
</template>
js:
<script lang="ts" setup>
import { ref, nextTick } from 'vue';
import { ElTable } from 'element-plus';
const searchstate = reactive({
list: [{id:1,chinaFieldName:"333"},{id:1,chinaFieldName:"333"}],
editableTabs: [{id:1,chinaFieldName:"333"}],
});
const multipleTableRef = ref<InstanceType<typeof ElTable>>();
searchstate.editableTabs.forEach((row) => {
nextTick(() => {
multipleTableRef.value!.toggleRowSelection(row, undefined);
});
});
</script>
以下方法本地正常,部署后会报错,不可行!!
<script lang="ts" setup>
import {
defineComponent,
ref,
reactive,
toRefs,
onMounted,
nextTick,
getCurrentInstance,
defineEmits,
} from 'vue';
const multipleSelection = ref([])
const instance = getCurrentInstance();
var ultipleTabInstance = toRefs(instance.refs.multipleTableRef);
searchstate.editableTabs.forEach((row) => {
nextTick(() => {
ultipleTabInstance.toggleRowSelection.value(row, true);
});
});
</script>
GitHub 加速计划 / eleme / element
54.06 K
14.63 K
下载
A Vue.js 2.0 UI Toolkit for Web
最近提交(Master分支:3 个月前 )
c345bb45
7 个月前
a07f3a59
* Update transition.md
* Update table.md
* Update transition.md
* Update table.md
* Update transition.md
* Update table.md
* Update table.md
* Update transition.md
* Update popover.md 7 个月前
更多推荐
已为社区贡献3条内容
所有评论(0)