«Кнопка» не определена реагировать / jsx-no-undefact.js

1

im a noob в React.js, и просто возиться с компонентами и прослушивателями событий, я пытаюсь добавить eventlistener к кнопке, но он почему-то не работает... Я попытался импортировать элемент, но это просто дает кучу других ошибок, может кто-нибудь рассказать мне, как я могу заставить это работать? Спасибо

import React from 'react'; 
import ReactDOM from 'react-dom';



class Passiing extends React.Component {
  scream() {
    alert('you passed!');
  }

  render() {
    return <Button onClick={this.scream}>Did you pass?</Button>;
  }
}

ReactDOM.render(<Button />, document.getElementById('app'));



export default Passiing; 
Теги:

4 ответа

0
Лучший ответ

Вам нужно будет импортировать кнопку с помощью реакции-бутстрапа.

import {Button} из 'response-bootstrap';

Чтобы стиль отображался, установите bootstrap и импортируйте 'bootstrap/dist/css/bootstrap.css' и добавьте его в index.js

Чтобы использовать кнопку,

Отправить Изображение 146838

1

Проблема точно такая же, как указано в ошибке. Вы используете компонент Button который не определен нигде. Вам нужно либо определить класс Button либо Button импорта где-нибудь (например, библиотеку пользовательского интерфейса).

  • 0
    Было бы интересно услышать обоснование понижения. Это именно то, что происходит.
  • 0
    может он хотел как это сделать? нет причин для понижения голосов, буду голосовать против вас!
0

Вы пытаетесь использовать реакцию-бутстрап? если это так, добавьте этот импорт: import { Button } from 'react-bootstrap', если вы еще не установили его, выполните следующую команду:

$ npm install --save react react-dom
$ npm install --save react-bootstrap

если у вас нет намерения использовать его, вы должны сами создать компонент Button Button и импортировать его.

  • 0
    спасибо, это работает сейчас, но по какой-то причине стиль не появляется?
  • 0
    return <Button bsSize = "small" onClick = {this.scream}> AAAAAH! </ Button>;
Показать ещё 5 комментариев
0

Ваш код должен выглядеть так.

import React from 'react'; 
import ReactDOM from 'react-dom';



class Passiing extends React.Component {
  constructor(props) {
    super(props)
    this.scream = this.scream.bind(this);
  }
  scream() {
    alert('you passed!');
  }

  render() {
    return (
      <input type='button' value="button" onClick={this.scream} />
    );
  }
}

ReactDOM.render(<Passiing/>, document.getElementById('app'));



export default Passiing; 
  • 0
    Это тоже работает! Ницца.

Ещё вопросы

Сообщество Overcoder
Наверх
Меню