Ошибка типа: this.setState.myItems не определена - PullRequest
0 голосов
/ 10 мая 2019

Я почти уверен, что код верен, но я все еще получаю сообщение об ошибке "TypeError: this.setState.myItems не определено", когда я нажимаю кнопку удаления, я пытался удалить конкретный элемент, используя метод setState в filter ().ошибка в строке 35: const FilterItems = this.setState.myItems.filter (myItem => {

там

    import React from "react";
    import PropTypes from "prop-types";
    import { returnStatement, isTemplateElement } from "@babel/types";
    import "./style.css";

    class App extends React.Component {
    constructor(props) {
    super(props);
    this.state = {
    myItems: ["Poco F1", "OnePlus 6", "MiA1", "S7 Edge"]
    };
      }

    addItem(e) {
e.preventDefault();
const { myItems } = this.state;
const newItem = this.newItem.value;
const exists = myItems.includes(newItem);

if (exists) {
  this.setState({
    message: "This Phone is already listed"
  });
} else {
  newItem !== "" &&
    this.setState({
      myItems: [...this.state.myItems, newItem]
    });
}

this.newForm.reset();
  }

    removeItem(item) {
const filteredItems = this.setState.myItems.filter(myItem => {
  return myItem !== item;
});

     this.setState({
        myItems: [...filteredItems]
      });
      }

       render() {
        const { myItems, message } = this.state;
        return (
        <div>
    <h1>
      <b>PHONE LIST</b>
    </h1>
    <form
      ref={input => (this.newForm = input)}
      onSubmit={e => this.addItem(e)}
    >
      <div className="form-group">
        <label className="sr-only" htmlFor="newItemInput">
          {" "}
          ADD NEW PHONE
        </label>
        <input
          type="text"
          ref={input => (this.newItem = input)}
          placeholder="Enter Phone Name"
          className="form-control"
          id="newItemInput"
        />
      </div>
      <button type="submit">ADD</button>
    </form>
    <div className="content">
      <table className="table">
        <thead>
          <tr>
            <th>Number</th>
            <th>Phone Name</th>
            <th>add/remove</th>
          </tr>
        </thead>
        <tbody>
          {myItems.map(item => {
            return (
              <tr key={item}>
                <td scope="row">1</td>
                <td>{item}</td>
                <td>
                  <button
                    onClick={e => this.removeItem(item)}
                    type="button"
                  >
                    REMOVE
                  </button>
                </td>
              </tr>
            );
          })}
        </tbody>
         </table>
       </div>
          <ol />
         </div>
        );
         }
          }

      export default App;

Я хочу удалить определенный элемент с помощью setState вметод filter ()

Ответы [ 2 ]

2 голосов
/ 10 мая 2019

Изменить this.setState.myItems на this.state.myItems

0 голосов
/ 10 мая 2019

this.state.myItems вместо this.setState.myItems:)

...