cascader Click icon to expand

This commit is contained in:
lifenglu 2019-11-01 18:25:52 +08:00
parent 5bc98a52cf
commit b2c3442f20
2 changed files with 28 additions and 9 deletions

View file

@ -44,6 +44,7 @@
[selectPrefixCls + '-item-disabled']: item.disabled [selectPrefixCls + '-item-disabled']: item.disabled
}]" }]"
v-for="(item, index) in querySelections" v-for="(item, index) in querySelections"
:key="index"
@click="handleSelectItem(index)" v-html="item.display"></li> @click="handleSelectItem(index)" v-html="item.display"></li>
</ul> </ul>
</div> </div>

View file

@ -7,9 +7,18 @@
:prefix-cls="prefixCls" :prefix-cls="prefixCls"
:data="item" :data="item"
:tmp-item="tmpItem" :tmp-item="tmpItem"
@click.native.stop="handleClickItem(item)" @click.native.stop="handleClickItem(item, $event)"
@mouseenter.native.stop="handleHoverItem(item)"></Casitem> @mouseenter.native.stop="handleHoverItem(item)"
</ul><Caspanel v-if="sublist && sublist.length" :prefix-cls="prefixCls" :data="sublist" :disabled="disabled" :trigger="trigger" :change-on-select="changeOnSelect"></Caspanel> ></Casitem>
</ul>
<Caspanel
v-if="sublist && sublist.length"
:prefix-cls="prefixCls"
:data="sublist"
:disabled="disabled"
:trigger="trigger"
:change-on-select="changeOnSelect">
</Caspanel>
</span> </span>
</template> </template>
<script> <script>
@ -48,16 +57,25 @@
} }
}, },
methods: { methods: {
handleClickItem (item) { isIcon(node){
let nodeName = (node.nodeName || "").toLocaleUpperCase();
let isIvu = node.classList.contains("ivu-icon");
if(nodeName == "I" && isIvu){
return true;
}
return false;
},
handleClickItem (item, ev) {
let isIcon = this.isIcon(ev.target);
if (this.trigger !== 'click' && item.children && item.children.length) return; // #1922 if (this.trigger !== 'click' && item.children && item.children.length) return; // #1922
this.handleTriggerItem(item, false, true); this.handleTriggerItem(item, false, true,isIcon);
}, },
handleHoverItem (item) { handleHoverItem (item) {
if (this.trigger !== 'hover' || !item.children || !item.children.length) return; // #1922 if (this.trigger !== 'hover' || !item.children || !item.children.length) return; // #1922
this.handleTriggerItem(item, false, true); this.handleTriggerItem(item, false, true,false);
}, },
//#6158 -- default fromInit = false to fromInit = true; //#6158 -- default fromInit = false to fromInit = true;
handleTriggerItem (item, fromInit = true, fromUser = false) { handleTriggerItem (item, fromInit = true, fromUser = false,isIcon=false) {
if (item.disabled) return; if (item.disabled) return;
const cascader = findComponentUpward(this, 'Cascader'); const cascader = findComponentUpward(this, 'Cascader');
@ -90,7 +108,7 @@
if (item.children && item.children.length){ if (item.children && item.children.length){
this.sublist = item.children; this.sublist = item.children;
this.dispatch('Cascader', 'on-result-change', { !isIcon && this.dispatch('Cascader', 'on-result-change', {
lastValue: false, lastValue: false,
changeOnSelect: this.changeOnSelect, changeOnSelect: this.changeOnSelect,
fromInit: fromInit fromInit: fromInit
@ -105,7 +123,7 @@
} }
} else { } else {
this.sublist = []; this.sublist = [];
this.dispatch('Cascader', 'on-result-change', { !isIcon && this.dispatch('Cascader', 'on-result-change', {
lastValue: true, lastValue: true,
changeOnSelect: this.changeOnSelect, changeOnSelect: this.changeOnSelect,
fromInit: fromInit fromInit: fromInit