(component): 新增 pageHeader 组件 backIcon 属性, 修复 select 组件 label 为 null 时的搜索问题

This commit is contained in:
就眠儀式 2022-11-07 21:46:16 +08:00
parent feecce3a05
commit 9f01bd84fa
3 changed files with 13 additions and 7 deletions

View File

@ -1,7 +1,7 @@
<template> <template>
<div class="lay-page-header"> <div class="lay-page-header">
<div class="lay-page-header__left" @click="emits('back')"> <div class="lay-page-header__left" @click="emits('back')">
<i class="layui-icon layui-icon-return"></i> <i class="layui-icon" :class="[ backIcon ]"></i>
<div class="lay-page-header__title">{{ backText }}</div> <div class="lay-page-header__title">{{ backText }}</div>
</div> </div>
<div class="lay-page-header__content"> <div class="lay-page-header__content">
@ -23,10 +23,12 @@ import "./index.less";
export interface PageHeaderProps { export interface PageHeaderProps {
content?: string; content?: string;
backText?: string; backText?: string;
backIcon?: string;
} }
const props = withDefaults(defineProps<PageHeaderProps>(), { const props = withDefaults(defineProps<PageHeaderProps>(), {
content: "", content: "",
backText: "返回", backText: "返回",
backIcon: "layui-icon-return"
}); });
const emits = defineEmits(["back"]); const emits = defineEmits(["back"]);

View File

@ -12,8 +12,7 @@ import {
inject, inject,
WritableComputedRef, WritableComputedRef,
Ref, Ref,
onMounted, onMounted
useSlots,
} from "vue"; } from "vue";
export interface SelectOptionProps { export interface SelectOptionProps {
@ -67,8 +66,8 @@ const select = () => {
const display = computed(() => { const display = computed(() => {
return ( return (
props.keyword.toString().indexOf(searchValue.value) > -1 || props.keyword?.toString().indexOf(searchValue.value) > -1 ||
props.label.toString().indexOf(searchValue.value) > -1 props.label?.toString().indexOf(searchValue.value) > -1
); );
}); });

View File

@ -117,7 +117,7 @@ export default {
<template> <template>
<lay-space> <lay-space>
<lay-select v-model="value3" :show-search="true"> <lay-select v-model="value3" :show-search="true" @search="search">
<lay-select-option value="1" label="学习"></lay-select-option> <lay-select-option value="1" label="学习"></lay-select-option>
<lay-select-option value="2" label="编码"></lay-select-option> <lay-select-option value="2" label="编码"></lay-select-option>
<lay-select-option value="3" label="运动"></lay-select-option> <lay-select-option value="3" label="运动"></lay-select-option>
@ -138,9 +138,14 @@ export default {
const value3 = ref('1') const value3 = ref('1')
const value4 = ref(['1']) const value4 = ref(['1'])
const search = function() {
console.log("触发")
}
return { return {
value3, value3,
value4 value4,
search
} }
} }
} }