iOS textarea标签 placeholder多行时被隐藏，收起键盘又显示

问题描述

如下图所示，项目里用到了textarea及其placeholder属性。在iOS上输入文字后删除，placeholder文字被隐藏了，只能显示一行，收起键盘后又能正常显示

原因

未知

解决方案

1、思路

动态设置标签的placeholder属性，获取输入框的值，当输入框的值为空时显示placeholder，不为空时不显示

2、具体代码

我的项目是用react写的，所以下面代码实现也是react的写法，可以根据框架自行调整

 constructor(props) {
        super(props);
        this.describeRef = React.createRef();
    }

 componentDidMount() {
        //初始时设置placeholder的值
        this.describeRef.current.placeholder = '话题简介描述xxxxxx';
    }

 handleInputChange = (e) => {
        this.setState({
            describe: e.target.value.trim()
        }, () => {
            //动态设置placeholder fix ios placeholder显示bug
                let {describe} = this.state;
                
                if (describe == '') {
                    this.describeRef.current.placeholder = '话题简介描述xxxxxx';
                } else {
                    //输入框内容不为空时，placeholder可以是个任意字符串，我直接置空时也还是会出现上述bug，所以可以给它个任意值
                     //vue 在watch监听，直接将placeholder置空是可以的，react里面不行，得赋个值
                    this.describeRef.current.placeholder = 'xxx'; 
                }
            }
        });

HTML部分

       <textarea id="describe" name="describe" ref={this.describeRef}
             onChange={this.handleInputChange} value={this.state.describe}/>

在网上找了一下，没有太多描述这个bug的，如果有碰到上述bug的可以参考解决方案，亲测是能解决的