JSX实现Stopwatch秒表出现同名属性报错如何修复

JSX 语法规定单个元素上不能存在多个同名属性，你的代码里给Stopwatch组件重复定义了两次msecs属性：

• 第一处是组件标签开头的无值布尔属性msecs，JSX 会默认把无值属性解析为true
• 第二处是标签末尾的赋值属性msecs={false}
  两个同名属性同时存在就会触发你看到的解析错误。

根据你实际的功能需求删掉其中一个重复的msecs属性即可。从你写的msecs={false}配置来看，你是需要关闭毫秒显示，直接删掉开头多余的无值msecs声明就行，修复后可正常运行的代码如下：

<Stopwatch 
  laps
  start={stopwatchStart}
  reset={stopwatchReset}
  options={{
    text: {
      fontFamily: 'Lato-Regular',
      fontSize: 15,
      color: '#FFF',
    },
  }}
  msecs={false}
/>

如果你实际需要开启毫秒显示，反向操作删掉msecs={false}、保留开头的无值msecs属性即可，两种配置二选一，不能同时保留同名属性。

内容的提问来源于stack exchange，提问作者Damian