反应未定义错误的水平时间轴距离
我试图在我的反应应用程序中使用反应水平时间线 ,但我得到的错误(指向行水平timeline.js#379):
Uncaught TypeError: Cannot read property 'distance' of undefined
我的代码包括:
import React, { Component } from 'react'; import HorizontalTimeline from 'react-horizontal-timeline'; class Foo extends Component { state = { value : '01-01-1990', previous: 0 }; render(){ const VALUES = ['20-04-1991']; return(){ <div> <HorizontalTimeline values={VALUES} indexClick={(index) => { this.setState({value: index, previous: this.state.value}); }} /> <div> {this.state.value} </div> </div> } } } export default Foo;
有人可以确定真正的问题,或者提出一些很好的select水平时间线的反应?
变化 :
1.你从render
方法返回2个元素,你需要把它们包装在一个div
。
检查这个答案更多的解释。
2.根据您附加的链接 ,值需要'mm/dd/yyyy'
格式的date列表,但您传递'dd/mm/yyyy'
是'dd/mm/yyyy'
:
const VALUES = ['20-04-1991'];
将其转换为正确的格式:
const VALUES = ['04/20/1991'];
试试这个 :
render(){ const VALUES = ['04/20/1991']; return(){ <div> <HorizontalTimeline values={VALUES} indexClick={(index) => { this.setState({value: index, previous: this.state.value}); }} /> <div className='text-center'> {this.state.value} </div> </div> } }
问题中发布的代码段中有两个主要问题。
-
错误的date格式:根据简单和有限的文件 ,所需的格式是
mm/dd/yyyy
。 由@Mayank指出 -
index
声明:在使用index={this.state.value}
之前需要先定义index={this.state.value}
看到类似的github问题