Javascript 基于数组长度显示进度条组件的状态

编辑：

我试过了

 <ProgressBar percentage={(percentage / 100) * questions.length} />

“我的进度条”的状态通过句柄单击功能更新

selectAnswer = answer => {
    this.setState(state => ({
      percentage: state.percentage + 20,
      currentQuestionId: state.currentQuestionId + 1,
    }))
  }

我的进度条现在功能齐全，每次用户转到下一个问题时，状态都会更新

我希望动态更新进度条的状态，根据数组显示其当前状态

questions object
    0: {id: 1, text: "What is your favourite number?", type: "multiChoice", choices: Array(3)}
    1: {id: 2, text: "What is your favourite colour?", type: "multiChoice", choices: Array(3)}
    2: {id: 3, text: "Which workshop would you prefer?", type: "cardChoice", choices: Array(2)}
    3: {id: 4, text: "Rank your favourite movie from Top to Bottom", type: "rankChoice", choices: Array(5)}
    4: {id: 5, text: "The end.", type: "end"}

---

例如，如果currentQuestionId==2，则此.state.percentage将反映这一点，或者如果currentQuestionId==5，则此state.percentage将为100

您可以将

currentQuestionId

乘以20或除以100除以问题数。currentQuestionId只需让应用程序知道显示哪个问题，我不应该用百分比除以问题数吗？我的意思是你可以将

currentQuestionId

乘以20，或者你可以将

currentQuestionId

乘以（100除以问题数）。@Yousername我应该在哪里做呢？在你选择的答案中，或者你认为最好的地方。你可以用20乘以或100除以问题数。currentQuestionId只需让应用程序知道显示哪个问题，我不应该用百分比除以问题数吗？我的意思是你可以将

currentQuestionId

乘以20，或者你可以将

currentQuestionId

乘以（100除以问题数）。@Yousername我应该在哪里做？在你选择的答案中，或者在你认为最好的地方。

selectAnswer = answer => {
    this.setState(state => ({
      percentage: state.percentage + 20,
      currentQuestionId: state.currentQuestionId + 1,
    }))
  }

questions object
    0: {id: 1, text: "What is your favourite number?", type: "multiChoice", choices: Array(3)}
    1: {id: 2, text: "What is your favourite colour?", type: "multiChoice", choices: Array(3)}
    2: {id: 3, text: "Which workshop would you prefer?", type: "cardChoice", choices: Array(2)}
    3: {id: 4, text: "Rank your favourite movie from Top to Bottom", type: "rankChoice", choices: Array(5)}
    4: {id: 5, text: "The end.", type: "end"}