Question

我正在尝试为按钮生成点击事件。我在变量中放置了按钮，以映射用于服务的不同按钮，但单击事件不起作用。其给出“无法读取未定义的属性'addCompnay'”。有人可以帮我吗？

   class Sidebar extends React.Component {

    constructor(props) {

       super(props);

       this.state = {

          allServices:[],

       }

       this.addCompnay = this.addCompnay.bind(this);


  }

  addCompnay() {

      alert("asd");

  }

  render() {

  var sidebarpagedata = this.state.allServices.companies.map(function(sidebarpagedata, index){
<Button type="button" className="default pull-right" onClick={this.addCompnay} >Apply Now</Button>

 })

 return (

  {sidebarpagedata}

 );

}

Answer 1

此代码有2个问题：

  var sidebarpagedata = this.state.allServices.companies.map(function(sidebarpagedata, index){
<Button type="button" className="default pull-right" onClick={this.addCompnay} >Apply Now</Button>

 })

您的地图函数具有不同的this上下文，可以是arrow function用户，也可以是显式地传递this：

var sidebarpagedata = this.state.allServices.companies.map((sidebarpagedata, index) => {
<Button type="button" className="default pull-right" onClick={this.addCompnay} >Apply Now</Button>

 })

这里的第二个问题是您缺少return，请将其更改为：

var sidebarpagedata = this.state.allServices.companies.map((sidebarpagedata, index) => {
 return (<Button type="button" className="default pull-right" onClick={this.addCompnay} >Apply Now</Button>)

 })

Answer 2

使用

library(tidyverse)
k <- 2
l1 <- split.default(df, as.integer(gl(ncol(df), k, ncol(df))))
i1 <- seq_along(l1)
nm1 <- tail(names(df), 1)
l1 %>% 
    map2_dfc(., i1, ~ 
                 .x %>% 
                  add_column(!! df2[.y] := NA, .before = 1)) %>% 
                  add_column(!!df2[-i1] := NA, .after = nm1)
#  ee aa bb ff cc dd gg
#1 NA  a  a NA  a  a NA
#2 NA  b  b NA  b  b NA
#3 NA  c  c NA  c  c NA
#4 NA  d  d NA  d  d NA
#5 NA  e  e NA  e  e NA

Answer 3

在以下情况下，如果使用箭头函数，则无需绑定该函数。

class Sidebar extends React.Component {

    constructor(props) {

       super(props);

       this.state = {

          allServices:[],
       }
  }

  addCompnay = () => {
      alert("asd");
  }

  render() {

  var sidebarpagedata = this.state.allServices.companies.map(function(sidebarpagedata, index){
<Button type="button" className="default pull-right" onClick={() => this.addCompnay()} >Apply Now</Button>

 })

 return (

  {sidebarpagedata}

 );

}

代码位于变量中时，React.js中的OnClick事件绑定

3 个答案: