Question

我正在使用ASP.NET MVC运行ReactJS.NET，一切都很好，除了......我无法解决任何类型的事件......

我尝试了什么：

1）消除所有JQuery引用/用法 - 没有成功

2）onHover，onClick，包含React组件内部和外部的功能 - 不成功

这是我的代码：

在index.cshtml中附加ProductLine React组件

@Html.React("ProductLine", Model)

反应组件

function addToCart() {
alert("Hoohohoho!!!");
};

var ProductLine = React.createClass({
    render: function () {
        return(
            <div className="col-md-12 col-sm-12 col-xs-12" key={this.props.productData.name}>
                <button onClick={this.addToCart}>Click me!</button>
                <div className="row" >
                    <div onClick={addToCart} className="col-md-12 col-sm-12 col-xs-12 nopadding row-default" >
                        <div className="col-md-3 col-sm-5 col-xs-5 nopadding">
                            <span className="table table-col ">
                                <input type="checkbox" id="cbxCheck2" className="jq_select_product" />
                                <label htmlFor="cbxCheck2" className="jq_select_product">{ this.props.productData.name }</label>
                            </span>
                        </div>
                        <div className="col-md-4 hidden-sm hidden-xs nopadding">
                            <span className="table table-col table-text-small">
                                { this.props.productData.label }
                            </span>
                        </div>
                        <div className="col-md-3 col-sm-4 col-xs-4 nopadding">
                            <span className="table table-col">
                                849,- (12 mnd)
                            </span>
                        </div>
                        <div className="col-md-2 col-sm-3 col-xs-3 nopadding">
                            <span className="table table-col table-text-small text-right">
                                <img id="imgShowMore" src="../../Images/arrow_purple_down.png" className="show-more _icon jq_expand_listview" /><label className="show-more _lbl jq_expand_listview">Vis mer</label>
                            </span>
                        </div>
                    </div>
                    <ProductDetails productData={this.props.productData} />
                </div>
            </div>
        );
    },
    addToCart: function (e) {
        alert("Hooooo!!!");
    },
});

Answer 1

经过半天的反复试验，我突然试图将所有JSX文件引用放在_Layout.cshtml页面的底部......

实际上解决了这一切......

ReactJS.NET：无法触发点击事件

1 个答案: