Unverified Commit c84087e7 by Sendya

feat: TagSelect

parent d822ccf0
import { Tag } from 'ant-design-vue'
const { CheckableTag } = Tag
export default {
name: 'TagSelectOption',
props: {
prefixCls: {
type: String,
default: 'ant-pro-tag-select-option'
},
defaultValue: {
type: [String, Number, Object],
required: true
},
value: {
type: [String, Number, Object],
required: true
},
checked: {
type: Boolean,
default: false
}
},
data () {
return {
val: this.value || this.defaultValue || null,
localChecked: this.checked || false
}
},
methods () {
},
render () {
const { $slots, $props, val } = this
const props = {
...$props
}
const onChange = (checked) => {
this.localChecked = checked
this.$emit('change', { val, checked })
}
return (<CheckableTag {...{ props }} onChange={onChange}>
{$slots.default}
</CheckableTag>)
}
}
import PropTypes from 'ant-design-vue/es/_util/vue-types'
// TODO
import TagSelectOption from './TagSelectOption.jsx'
import { filterEmpty } from '@/components/_util/util'
export default {
name: 'TagSelect',
props: {
defaultValue: {
type: [PropTypes.arrayOf(String), PropTypes.arrayOf(Number)],
default: () => {}
prefixCls: {
type: String,
default: 'ant-pro-tag-select'
},
defaultValue: {
type: PropTypes.object,
default: () => []
,
value: {
type: PropTypes.object,
default: () => []
,
expandable: {
type: Boolean,
default: false
......@@ -15,5 +25,45 @@ export default {
type: Boolean,
default: false
}
},
data () {
return {
expand: false,
val: this.value || this.defaultValue || []
}
},
methods: {
onChange () {
},
// render option
renderTag ({ value, checked }) {
const props = {
checked: checked,
value: value
}
return (
<TagSelectOption {...{ props }} />
)
},
renderTags (items) {
return items.map(item => this.renderTag(item))
}
}
},
render () {
const { $props: { prefixCls }, renderTags } = this
const classString = {
[`${prefixCls}`]: true
}
const tagItems = filterEmpty(this.$slots.default)
const tagItemDom = (tagItems && tagItems.length > 0) && renderTags(tagItems) || null
return (
<div class={classString}>
{tagItemDom}
</div>
)
}
}
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment