如何根据索引 React 为所选元素赋值？

Question

预期效果：点击<li> </ li>-> 取索引 li -> 共享index并this.state.todos在组件中clock-> 在index从数组中选择元素的基础上-> 将返回的值赋给所选元素Math.random ()---> 从数组中选择一个粘附元素 ->为其分配一个不同的随机值 -> 单击上一个元素 ---> 显示我为其分配的值。在控制台中，我来自selectState未定义。当我在<li>索引之间切换时不会改变。寻求一些建议。

this.sate.selec 移动到组件 'clock' 并分配给 this.state.selectTodo

应用程序

class App extends React.Component {

  constructor() {

    super();

    this.state = {

        withInitialTodos: true,

        selec: null,

        todos: [

            {

                time: '00:00:10',

                description: 'Hello'

            },

            {

                time: '00:00:20',

                description: 'World'

            }

        ],

        todo: {

            'time': '00:00:30',

            'description': 'W'

        },

        selectTodo: {

            "times": [{ 'time': '00:00:40' }, { 'time': '00:00:50' }],

            "description": " ytytyty",

            "id": 3,

            "title": "gfgfgfgfgf"

        },

        saveTodo: {

            "time": '03:03:03'

        }

    };

  }

  selectTodo = (index) => {

    this.setState({

      selec: index

    })

  }

  createTodo = (todo) => {

    this.setState({

        withInitialTodos: false,

        todos: [].concat(this.state.todos, this.state.todo),

        selectTodo: {

            ...this.state.selectTodo,

            times: [].concat(

                this.state.selectTodo.times,

                this.state.withInitialTodos ? this.state.todos.map(({ time }) => ({ time })): [],

                {

                  time: this.state.todo.time

                }

            )

        }

    });

  }

  saveTodo = (description) => {

    const todo = {

      description,

      time: '03:03:03'

    };

    const todos = [].concat(this.state.todos, todo);

    this.setState({

      todos

    });

  }

演示：https : //stackblitz.com/edit/react-pxjzb3