Question

我在React组件中有一个链接：

<a href="#goals-tab" className={ this.setTabStyle()}>Goals</a>

现在，在setTabStyle方法内，我是否可以访问a元素的属性，例如href，而无需将其作为参数明确地传递给方法？

Answer 1

如果您使用ref，那么您的组件将呈现DOM 而不样式，然后应用新样式。因此用户会注意到样式的变化。

我建议将链接作为参数传递给setTabStyle(link)，或者将链接作为组件的另一个支柱：

var Component = React.createClass({
    handleClick: function (e) {
        console.log(e.currentTarget.getAttribute('href'));
    },

    setTabStyle: function () {
        if (this.props.link == this.props.activelink) {
            return myActiveLinkStyle
        } else {
            return myInactiveLinkStyle
        }
    },

    render: function() {
        return <a href={this.props.link} style={this.setTabStyle()} onClick={this.handleClick}>Click</a>;
    }
});

这样，你从初始加载中得到了正确的风格..

从React中的方法获取包装DOM元素属性

1 个答案: