form表单提交数据时，keywords会替换掉之前原有的参数？

Question

如题：这样的情况怎么解决好呢？，然道写一个提交前处理keywords再拼接上去的方法？

代码：

<form acceptCharset="gbk" method="get" action="https:xxx_search.htm?product=true&tags=123" >
                <div className="searchBar">
                  <input className="searchVal" placeholder="输入关键词搜索" 
                  value={this.state.value} name="keywords"
                    onChange={event => {
                      this.setState({
                        value: event.target.value,
                      });
                    }} />
                  <button className="searchBtn" type="submit">搜索</button>
                </div>
              </form>

Answer 1

<form action="https:xxx_search.htm">
    <input type="hidden" name="product" value="true"/>
    <input type="hidden" name="tags" value="123"/>
    <input className="searchVal" placeholder="输入关键词搜索" 
                  value={this.state.value} name="keywords"
                    onChange={event => {
                      this.setState({
                        value: event.target.value,
                      });
                    }} />
</form>

Answer 2

不用form表单的默认提交，用fetch或者axios异步提交

search(){
    const {value} = this.state;
    fetch(`https:xxx_search.htm?product=true&tags=123&keywords=${value}`).then(...)
}
render(){
    // ...
     <div className="searchBar">
        <input
            className="searchVal"
            placeholder="输入关键词搜索" 
            value={this.state.value} name="keywords"
            onChange={event => {
                this.setState({
                    value: event.target.value,
                });
            }} />
        <button className="searchBtn" onClick={this.search}>搜索</button>
    </div>
}