Ken428965 2022-10-31 23:30 采纳率: 53.6%
浏览 9
已结题

react,chrome浏览器报错:Uncaught ReferenceError: renderTags is not defined

在使用的react版本如下:

img


已写的部分代码:

// ...
function HouseDetail(props) {
  // 数据加载中状态
  const [isloading, setIsloading] = useState(false)
  // 表示房源是否收藏
  const [isfavorite, setIsfavorite] = useState(false)
  // 房屋详情
  const [houseinfo, setHouseinfo] = useState({
      // 房屋图片
      houseImg: [1],
      // 标题
      title: '',
      // 标签
      tags: [],
      // 租金
      price: 0,
      // 房型
      roomType: '',
      // 房屋面积
      size: 0,
      // 朝向
      oriented: [],
      // 楼层
      floor: '',
      // 小区名称
      community: '',
      // 地理位置
      coord: {
        latitude: '39.928033',
        longitude: '116.529466'
      }
  })
// ...
useEffect(()=>{
// ...
// 渲染标签
  function renderTags() {
    const { tags } = houseinfo

    return tags.map((item, index) => {
      // 如果标签数量超过3个,后面的标签就都展示位第三个标签的样式
      let tagClass = ''
      if (index > 2) {
        tagClass = 'tag3'
      } else {
        tagClass = 'tag' + (index + 1)
      }

      return (
        <span key={item} className={[styles.tag, styles[tagClass]].join(' ')}>
          {item}
        </span>
      )
    })
  }
},[])
// ...
return (
// ...
<div className={styles.tags}>
            <div>{renderTags()}</div>
          </div>
// ...
)

浏览器报错:

img

请问代码出了什么问题?请问正确的写法是什么?望在现有代码里举例说明

  • 写回答

1条回答 默认 最新

  • 崽崽的谷雨 2022-11-01 09:30
    关注

    renderTags 写在 useEffetc里 了 。 写到它的外面 。然后 用const renderTags(){} 声明

    本回答被题主选为最佳回答 , 对您是否有帮助呢?
    评论

报告相同问题?

问题事件

  • 已结题 (查看结题原因) 11月1日
  • 已采纳回答 11月1日
  • 创建了问题 10月31日

悬赏问题

  • ¥15 AttributeError: 'NoneType' object has no attribute 'drop_duplicates'报错
  • ¥15 编写c++计算器,要求如下
  • ¥15 以下代码,运行结果报错
  • ¥15 Vivado仿真数据出错
  • ¥15 银河麒麟不支持vant等前端框架怎么办?
  • ¥15 vue3的子组件在父页面调用不显示不生效问题
  • ¥15 cadence PEX
  • ¥15 phython创建了文件 显示在项目下面,但运行不了,运行时还是运行main文件,并且说main文件不允许并行运行
  • ¥20 C++哈希表的设计构造哈希表
  • ¥15 FutureWarning:不推荐使用空或全 NA 条目的 DataFrame 串联行为。怎么改呢?