iview Transfer 组件怎么写
时间: 2023-05-22 19:06:30 浏览: 48
感谢您的提问,iView Transfer 组件的代码可以在官方文档中找到,以下是一个简单的例子:
```
<template>
<Transfer :data="data" :target-keys="targetKeys" :render-format="render-format" @on-change="handleChange"></Transfer>
</template>
<script>
export default {
data() {
return {
data: [
{
key: '1',
label: 'Option 1'
},
{
key: '2',
label: 'Option 2'
},
{
key: '3',
label: 'Option 3'
},
{
key: '4',
label: 'Option 4'
},
{
key: '5',
label: 'Option 5'
}
],
targetKeys: [],
render-format: (item) => {
return item.label
}
}
},
methods: {
handleChange(e) {
console.log(e)
}
}
}
</script>
```
以上代码演示了一个包含了数据源 (data) 和目标数据源 (targetKeys) 的 Transfer 组件的基本用法,以及如何自定义渲染函数 (render-format) 和处理数据源变化 (handleChange)的示例。