diff --git a/src/dropdown-menu/__test__/__snapshots__/index.test.js.snap b/src/dropdown-menu/__test__/__snapshots__/index.test.js.snap
index ec94925df..166658e43 100644
--- a/src/dropdown-menu/__test__/__snapshots__/index.test.js.snap
+++ b/src/dropdown-menu/__test__/__snapshots__/index.test.js.snap
@@ -91,7 +91,7 @@ exports[`dropdown-menu :base 1`] = `
bind:visible-change="handleMaskClick"
>
+
`;
diff --git a/src/search/_example/base/index.js b/src/search/_example/base/index.js
index d6ebd8e2d..621e91131 100644
--- a/src/search/_example/base/index.js
+++ b/src/search/_example/base/index.js
@@ -1,5 +1,19 @@
Component({
data: {
value: '',
+ resultList: [],
+ },
+ methods: {
+ onChangeValue(e) {
+ const { value } = e.detail;
+
+ this.setData({
+ resultList: value
+ ? Array.from({ length: 3 }).map((v, i) => {
+ return `预览结果:${i}`;
+ })
+ : [],
+ });
+ },
},
});
diff --git a/src/search/_example/base/index.wxml b/src/search/_example/base/index.wxml
index 5ec180077..e3e61c42c 100644
--- a/src/search/_example/base/index.wxml
+++ b/src/search/_example/base/index.wxml
@@ -1,3 +1,7 @@
-
+
+
+
+
+
diff --git a/src/search/_example/base/index.wxss b/src/search/_example/base/index.wxss
index a5f17d78a..408ab45a6 100644
--- a/src/search/_example/base/index.wxss
+++ b/src/search/_example/base/index.wxss
@@ -2,3 +2,7 @@
background-color: #fff;
padding: 16rpx 32rpx;
}
+
+.example-search:not(:last-child) {
+ margin-bottom: 32rpx;
+}
\ No newline at end of file
diff --git a/src/search/props.ts b/src/search/props.ts
index 436ba7e7c..4202767bb 100644
--- a/src/search/props.ts
+++ b/src/search/props.ts
@@ -6,6 +6,11 @@
import { TdSearchProps } from './type';
const props: TdSearchProps = {
+ /** 预览结果列表 */
+ resultList: {
+ type: Array,
+ value: [],
+ },
/** 自定义右侧操作按钮文字 */
action: {
type: String,
diff --git a/src/search/search.less b/src/search/search.less
index 2e2fb01b3..dea119fd7 100644
--- a/src/search/search.less
+++ b/src/search/search.less
@@ -84,4 +84,23 @@
text-align: center;
}
}
+ &__result-item {
+ padding: 30rpx;
+ position: relative;
+ display: flex;
+ align-items: center;
+ font-size: 34rpx;
+ color: rgba(0, 0, 0, 0.55);
+ position: relative;
+ &:not(:last-child)::after {
+ content: '';
+ position: absolute;
+ left: 0;
+ bottom: 0;
+ right: 0;
+ height: 1rpx;
+ z-index: 2;
+ background-color: rgba(0, 0, 0, 0.1);
+ }
+ }
}
diff --git a/src/search/search.ts b/src/search/search.ts
index 87bebfb11..11e3df38a 100644
--- a/src/search/search.ts
+++ b/src/search/search.ts
@@ -59,6 +59,7 @@ export default class Search extends SuperComponent {
handleClear() {
this.setData({ value: '' });
this.triggerEvent('clear', { value: '' });
+ this.triggerEvent('change', { value: '' });
}
onConfirm(e) {
@@ -69,4 +70,14 @@ export default class Search extends SuperComponent {
onActionClick() {
this.triggerEvent('action-click');
}
+
+ selectResultItem(e) {
+ const { index } = e.currentTarget.dataset
+ const item = this.properties.resultList[index]
+ this.setData({
+ value: item
+ })
+ this.triggerEvent('change', { value: item });
+ this.triggerEvent('selectresult', { index, item })
+ }
}
diff --git a/src/search/search.wxml b/src/search/search.wxml
index 667d0d771..593e62592 100644
--- a/src/search/search.wxml
+++ b/src/search/search.wxml
@@ -59,3 +59,12 @@
+
+ {{item}}
+
diff --git a/src/search/type.ts b/src/search/type.ts
index 0ce847c52..b3ebad779 100644
--- a/src/search/type.ts
+++ b/src/search/type.ts
@@ -5,6 +5,10 @@
* */
export interface TdSearchProps {
+ resultList: {
+ type: ArrayConstructor;
+ value?: [];
+ };
/**
* 自定义组件样式
* @default ''