React中父组件在不render的状态下传一个动态的值给子组件，如何在子组件中更新？

Question

现在我有一个父组件里面有一个this.state.title, 这个title在我onClick的操作进行refetch数据时会得到改变，然而父组件并不会render，我现在有一个子组件接受this.state.title，并想在输入框中显示这个title，我可以编辑他，最后在子组件中点击button save这个信息。然而我发现每次父组件refetch，子组件的输入框的字符串并不会更新。

子组件的相关代码是这样的
type Props = {|

productSortTitle: string,

|}

state = {

productSortTitle: this.props.productSortTitle,

};

<TextInput

  onChange={this._handleProductSortTitleChange}
  value={this.state.productSortTitle}

/>

_handleProductSortTitleChange = event => {

this.setState({productSortTitle: this._sanitizeProductSortTitle(event)});

};

我觉得是因为子组件并没有re-render, 即使props改了它也接受不到。

完全的react新人。。。希望大神指教，百度了一下发现有这种玩法，也是我之前一直做的：
在React中，父子组件间的通信是通过props来传递参数的。一般情况下，父组件传一个值给子组件，同时还要传一个修改该值的方法函数。这样，在子组件中调用这个方法函数才能修改该值，并再次传给子组件，从而修改子组件状态。

但是觉得好绕，因为我这个productSortTitle的操作和save都是在子组件里进行的，可以的话并不想传回父组件，想请问一下有没有其他方法可以使子组件rerender呢？
知道shouldComponentUpdate，写了个
shouldComponentUpdate(nextProps: Props) {
return nextProps.productSortTitle !== this.props.productSortTitle;
}
加进去发现并无改变，T T

Answer 1

父组件不render，子组件肯定是无法获取到从父组件传入的props的。
只有让那个props与父组件无关，直接通过connect与redux的state相关。

//父组件
const Parent = () => {
    return <Children parentProps={/*...*/}/>
}

//子组件
const Children = connect(state => state)(({subState, parentProps}) => {
 //subState与父组件无关
}

Answer 2

给你一个demo

class Test extends React.Compont{
    constructor(props){
        super(props)
        this.state = {
            title: props.title
        }
    }
    componentWillReceiveProps(nextProps){
        // 如果确定title只有该组件修改，这个 componentWillReceiveProps 省掉
        if(this.props.title !== nextProps.title){
            this.setState({
                title: nextProps.title
            })
        }
    }
    getInput = input => this.input = input
    handleClick = () => {
        let title = this.input.value
        this,props.fun(title)  // 父组件该干嘛干嘛
        this.setState({
            title
        })
    }
    render(){
        return (
            <div>
                <input ref={this.getInput} type="text"/>
                <button onClick={this.handleClick}>Test</button>
            </div>
        )
    }
}

Answer 3

我遇到的跟题主一样的疑惑，我在如下文章对 props 的定义中找到了答案，这个定义是这样的：
“props 是只读的，只有通过父组件重新渲染的方式才可以把新的 props 传入组件中。”
因此在题主说的前提之下用 props 是无法实现题主的需求的，这正如楼上的答主“小翼”所说的。
因此解决办法解决办法也如答主“小翼”所说的，用 redux 管理这个数据。
《React组件的state和props》
《react中state、props以及两者的区别》

Answer 4

父组件fetch数据后 setState如果你没给父组件覆盖shouldComponentUpdate生命周期的话且继承的Component组件的话 一定会重新render的 父组件不render 你现在的问题应该是父组件不render导致的 先看父组件试试