TextInputBar.tsx 1.1 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243
  1. import { View } from "@tarojs/components"
  2. import IconMic from "@/components/icon/icon-mic"
  3. import { useState } from "react";
  4. import WemetaInput from '@/components/wemeta-input'
  5. interface Props {
  6. disabled: boolean,
  7. onIconClick: () => void
  8. onSend: (msg: string)=> void
  9. }
  10. export default ({disabled, onIconClick, onSend}:Props) => {
  11. const [value, setValue] = useState('')
  12. const handleInput = (value: string)=> {
  13. setValue(value)
  14. }
  15. const handleConfirm = (value: string)=> {
  16. console.log(value)
  17. if(!value.length){
  18. return;
  19. }
  20. onSend(value)
  21. setValue('')
  22. }
  23. const iconMic = ()=> {
  24. return <View className="flex-center" onClick={onIconClick}><IconMic /></View>
  25. }
  26. return <>
  27. <WemetaInput
  28. adjustPosition={false}
  29. disabled={disabled}
  30. extraStyle={{'borderRadius': '10px'}}
  31. confirmType="send"
  32. prefix={iconMic}
  33. placeholder="有问题尽管问我..."
  34. value={value}
  35. cursorSpacing={400}
  36. onConfirm={handleConfirm}
  37. onInput={(value: any) => handleInput(value)}
  38. >
  39. </WemetaInput>
  40. </>
  41. }