60 lines
2.2 KiB
TypeScript
60 lines
2.2 KiB
TypeScript
|
||
import { Input, Text, Textarea, View } from "@tarojs/components"
|
||
import { memo } from "react"
|
||
import "./index.scss"
|
||
|
||
interface ListParams{
|
||
label: string, //左边label
|
||
onInput?: (ev:Object)=>void, // 输入框输入
|
||
onClick?:()=>any, //点击列表
|
||
placeholder?:string, // 提示文本
|
||
children?: any, // 插槽
|
||
type?: string // 类型：1.input,2.textarea,3.select
|
||
value?: any,
|
||
style?: object, //整行样式
|
||
labelStyle?: object, // label样式
|
||
contentStyle?: object,
|
||
required?: boolean
|
||
}
|
||
|
||
// 表单列表
|
||
const FromList = memo((props:ListParams)=>{
|
||
const {type="input",value="",style={},labelStyle={},contentStyle={},required=false} = props;
|
||
|
||
return (
|
||
<View style={style} className="From-list-certification">
|
||
<View style={labelStyle} className={`From-list-certification-label ${required&&"From-list-certification-label-required"}`}>{props.label}</View>
|
||
<View onClick={props?.onClick} className="From-list-certification-right">
|
||
{
|
||
props.children??
|
||
<View style={contentStyle} onClick={props?.onClick} className="From-list-certification-right-meet">
|
||
{
|
||
type=="input"?
|
||
<View className="From-list-certification-input">
|
||
<Input value={value} placeholder-class="phcolor" onInput={props?.onInput} placeholder={props.placeholder} />
|
||
{value&&
|
||
<View><Text onClick={()=>props.onInput&&props.onInput({detail: {value: ""}})} className="iconfont icon-qingkong"/></View>
|
||
}
|
||
</View>:
|
||
type=="textarea"?<Textarea value={value} placeholder-class="phcolor" onInput={props?.onInput} placeholder={props.placeholder} />:
|
||
<>
|
||
{
|
||
props.value?<View>{value}</View>:
|
||
<View className="From-list-certification-right-placeholder">
|
||
{props.placeholder}
|
||
</View>
|
||
}
|
||
<View className="From-list-certification-right-enter"><Text className="iconfont icon-a-moreback"></Text></View>
|
||
</>
|
||
}
|
||
</View>
|
||
}
|
||
</View>
|
||
</View>
|
||
)
|
||
})
|
||
|
||
const A = ()=>{
|
||
|
||
}
|
||
export default FromList; |