Присвойте возвращаемое значение функции свойству объекта в React Native.

Question

export default class Leaderboard extends React.Component {
  
  constructor(props) {
    super(props);
    this.numLeaders = 10;
    this.topPlayers = populateLeaderboard(this.numLeaders);
    this.state = {
      tableHead: ['', 'Name', 'Age', 'School', 'Points'],
      //Trying to assign leaders array to tableTitle
      tableTitle: (function(this.numLeaders) {
        let leaders = [];
        for (let i = 0; i < numLeaders; i++) {
          leader.push(i);
        }
        return leaders;
      }())     
   
    };
  }

Итак, я пытаюсь сгенерировать массив внутри функции, а затем назначить его в качестве возвращаемого значения свойству объекта.Я не уверен, что я испортил Javascript или React, у меня нет тонны практики с объектами Javascript.

Answer 1

Если вы хотите сделать это по-своему, вот оно:

this.state = {
    tableHead: ["", "Name", "Age", "School", "Points"],
    tableTitle: (() => {
      const leaders = [];
      for (let i = 0; i < this.numLeaders; i++) {
        leaders.push(i);
      }
      return leaders;
    })(),
  };
}

Рабочий пример.

const state = {
  tableTitle: (() => {
        const leaders = [];
        for (let i = 0; i < 10; i++) {
          leaders.push(i);
        }
        return leaders;
      })(),
};

console.log(state.tableTitle);

Я пропустил часть аргумента здесь, так как вы уже можете достичь numleaders.Зачем вам нужен аргумент?

Кроме того, я использовал функцию стрелки выше, чтобы избежать привязки this.Если вы придерживаетесь своей версии, не забудьте привязать ее:

this.state = {
  tableHead: ["", "Name", "Age", "School", "Points"],
  tableTitle: function () {
    const leaders = [];
    for (let i = 0; i < this.numLeaders; i++) {
      leaders.push(i);
    }
    return leaders;
  }.bind(this)(),
};

Или, если вы действительно хотите придерживаться своей оригинально-оригинальной версии :), вы можете попробовать это:

this.state = {
  tableTitle: (function (numLeaders) {
    const leaders = [];
    for (let i = 0; i < numLeaders; i++) {
      leaders.push(i);
    }
    return leaders;
  }(this.numLeaders)),
};

Вы передаете аргумент, а затем возвращаете его.Нет необходимости связывать this здесь, так как вы не используете this.numLeaders в своей функции.

Вот альтернатива с некоторыми расширенными синтаксисами и клавиш .

this.state = {
  tableHead: ["", "Name", "Age", "School", "Points"],
  tableTitle: [...Array(this.numLeaders).keys()],
};

Рабочий пример:

const state = {
  tableTitle: [...Array(10).keys()],
};

console.log(state.tableTitle);

Но, если эти данные не являются динамическими, возможно, state не является подходящим местом для этого.