react-native - React-Native 在 TextInput 中一起调整表情符号和文本大小
问题描述
我想在 TextInput 中使用表情符号调整文本大小,只有文本效果很好,但插入表情符号时不行。
const [fontSize, setFontSize] = useState(16);
const input = useRef(null);
// resize Input func
const onFontSizeChange = () => {
setFontSize(fontSize + 5);
input.current.setNativeProps({
style: {
fontSize: fontSize + 5,
},
});
}
<TextInput
ref={input}
multiline={true}
style={{fontSize: 16}}
forceStrutHeight={true}
value={textValue}
onChangeText={typedText => {
validate(typedText);
}}
/>
我该怎么做?
解决方案
只需使用状态对象作为样式并在单击按钮时更改样式对象。
const [style, setStyle] = useState({ fontSize: 16})
const onButtonClick = () => {
setStyle({ fontSize: 20, lineHeight: 23 })
}
<TextInput
multiline={true}
style={style}
forceStrutHeight={true}
value={textValue}
onChangeText={typedText => {
validate(typedText);
}}
/>
推荐阅读
- html - 在没有 jquery 的 angularjs 中找到所有具有 ul/uls 的 li
- c - 创建一个 ASIO DSD 播放器
- javascript - 如何在 Angular 中获取活动路由快照 onpopstate 事件
- arrays - ReactJS如何在分页中一次显示5个页码
- javascript - 输入上的 onChange 不使用 setState 更新状态
- woocommerce - 如何在woocommerce中显示销售日期
- python - 将自定义字段从 MO BoM 行发送到 Odoo 中的 PO 订单行
- excel - 如何释放形状对象变量或重置它?
- javascript - 如何使用 Promise 返回函数调用
- c# - 使用库中的 netcoreapp2.1 API