Question

我希望每次在React中以alert()进行跟踪的Meteor订阅发生更改时，都显示一个模式对话框（例如withTracker）。

我尝试使用Tracker.autorun来跟踪更改，但是无法计算出将其放置在代码中的哪个位置。它似乎在Component构造函数中不起作用，并且每次放置在render()中都可以运行。

这是我的代码的轮廓：

class Foo extends Component {
    render() {
        return (
            <h1>Example Header</h1>
            { this.maybeShowAlert() }
        );
    }

    maybeShowAlert() {
       // ONLY if bar has been updated
       alert('bar has changed');
    }
}

export default withTracker(() => {

    Meteor.subscribe('bar')

    return {
        bar: Bar.findOne({})
    };
})(Foo);

Answer 1

以前从未使用过Meteor，但是如果您想响应状态/属性更改而做某事，那么componentDidUpdate()是它的生命周期方法。例如

componentDidUpdate(prevProps) {
    if (this.props.bar !== prevProps.bar {
        // bar prop has changed
        alert("bar changed);
    }
}

Answer 2

如果您要使用Tracker.autorun，那么最好的调用位置是componentDidMount，因为在组件mounted被调用之后它仅被调用一次。您只需要调用一次跟踪器函数，因为只要它依赖于changes的反应性数据源就可以重新运行跟踪器函数。在跟踪器函数中，您将根据maybeShowAlert的值调用bar，就像这样，

componentDidMount() {
    Tracker.autorun(() => {
        let bar = this.props.bar;
        if (bar) {
            this.maybeShowAlert();
        }
    }
}

仅当React属性更改时，如何调用函数？

2 个答案: