52 lines
1.6 KiB
TypeScript
52 lines
1.6 KiB
TypeScript
import { Input, View } from "@tarojs/components";
|
|
import { memo, ReactHTMLElement, ReactNode, useDebugValue, useMemo } from "react";
|
|
import styles from './index.module.scss';
|
|
|
|
type Params = {
|
|
showIcon?: false|true,
|
|
disabled?: false|true,
|
|
placeholder?: string,
|
|
title?: string,
|
|
showTitle?: false|true,
|
|
showBorder?: false|true,
|
|
changeOnInput?: (string) => void,
|
|
clickOnInput?: () => void,
|
|
children?: ReactNode
|
|
height?: string,
|
|
titleStyle?: Object,
|
|
styleObj?: Object
|
|
|
|
}
|
|
|
|
export default memo((props: Params) => {
|
|
let {
|
|
showTitle = true,
|
|
title = '标题',
|
|
showIcon = false,
|
|
disabled = false,
|
|
placeholder = '请输入',
|
|
showBorder = true,
|
|
changeOnInput,
|
|
clickOnInput,
|
|
height = '80rpx',
|
|
titleStyle = {}
|
|
} = props
|
|
|
|
let stylen = useMemo(() => {
|
|
if(!showBorder) {
|
|
return { borderBottom: 0 }
|
|
}
|
|
return {}
|
|
}, [showBorder])
|
|
return (
|
|
<View className={styles.searchInput_main} style={{height: height, ...stylen}}>
|
|
{showTitle&&<View className={styles.searchInput_title} style={titleStyle}>{title}</View>}
|
|
<View className={styles.searchInput_con}>
|
|
{!props.children&&<Input disabled={disabled} placeholder={placeholder} onClick={() => clickOnInput?.()} onInput={(e) => changeOnInput?.(e.detail.value)}/>
|
|
||<>{props.children}</>
|
|
}
|
|
</View>
|
|
{showIcon&&<View className={`iconfont icon-jiantou ${styles.icon_more_self}`}></View>}
|
|
</View>
|
|
)
|
|
}) |