给li设置滚动条 一个li时滚动条隐藏 多个时可以滑动 react代码实现

在React中实现给li设置滚动条的方法可以使用CSS样式来实现，具体如下：

1. 在li的样式中设置overflow属性为auto，这样当li内容过长时会自动生成滚动条，并且在li内容不足时不会出现滚动条。

2. 使用CSS伪类选择器:last-child来判断是否只有一个li元素，如果只有一个则将overflow属性设置为hidden，这样就可以隐藏滚动条。

下面是代码示例：

import React from 'react';
import './style.css';

function List(props) {
  const { items } = props;

  return (
    <ul className="list">
      {items.map(item => (
        <li key={item.id}>{item.content}</li>
      ))}
    </ul>
  );
}

export default List;

.list {
  list-style: none;
  padding: 0;
  margin: 0;
}

.list li {
  overflow: auto;
  white-space: nowrap;
}

.list li:last-child {
  overflow: hidden;
}

在上面的示例中，我们使用了CSS样式给li元素设置了滚动条，并且通过伪类选择器判断了li元素的数量，只有一个时隐藏了滚动条。在实际应用中，可以根据需要对CSS样式进行调整。