Попытка передать обработчик щелчка в запрос Apollo через реквизит - PullRequest
Новая
       12

Попытка передать обработчик щелчка в запрос Apollo через реквизит

0 голосов
/ 11 декабря 2018

Я пытаюсь передать обработчик кликов через реквизиты из этого класса 

class App extends Component {
 handleToggle = (todo:any) => () => {
  // update todo 
  console.log("I WORK!");
};

 render() {
  return (
    <div className="App">
      <Todos onTodoClick={this.handleToggle}/>
    </div>
  );
}

}

этой функции, которая содержит Query: 

  function Todos(props: any) {
    return (
      <Query query={GET_TODOS}>
        {({ loading, error, data }) => {
          if (loading) return "Loading...";
          if (error) return `Error! ${error.message}`;
          return (
            <div>
              <List>
                {data.todos.map((todo: any) => (
                  <ListItem
                    key={todo.id}
                    onClick={() => props.onTodoClick(todo)} // HERE
                  >
                     <ListItemText primary={todo.text} />
                  </ListItem>
                ))}
              </List>
            </div>
          );
        }}
      </Query>
    );
  }

Но, независимо от того, делаю я Todo функцию или просто const, этот обработчик щелчка реквизита никогда не вызывается.Я надеюсь увидеть "Я РАБОТАЮ!"в консоли, но этого не происходит.Любые идеи, как передать обработчик щелчка через реквизит, когда принимающая функция содержит запрос Apollo?

1 Ответ

0 голосов
/ 12 декабря 2018

Ах, я глупый.Я написал handleToggle плохо.Это должно было быть: 

handleToggle = (todo:any) => {
  // update todo 
  console.log("I WORK!");
};

И внутри App, позвоните Todos с 

<Todos onTodoClick={()=>this.handleToggle}/>
...