TypeScript报constructor/accessor/property expected错误排查

报错原因与修复（函数定义错误） #

你遇到的a constructor method accessor or property was expected报错，核心原因是函数声明语法错误：JS/TS中定义函数时，函数名后必须跟参数括号()，哪怕函数没有入参也不能省略，你写的function setTotalBoth {漏了这对括号。
除此之外你的计数逻辑还有3个会导致功能失效的问题：

• 计数器变量定义在函数内部，每次调用函数都会把两个计数器重置为0，永远无法实现累加
• 判断相等建议用严格等于===，避免==带来的隐式类型转换导致判断逻辑出错
• 累加时只写setBigCar +1仅做了计算没有赋值，不会修改变量值，需要写成setBigCar += 1才会生效

计数结果展示修复（PageHeader组件渲染问题） #

你当前的PageHeader写法有两个问题：

1. 组件标签结构错误，额外的span展示内容没有放在组件的合法插槽位置
2. 只写了静态文本，没有绑定动态计数变量，且普通var变量更新后不会触发React页面重渲染，计数变了页面也不会同步更新
   正确的实现需要用React的useState做响应式状态存储，动态值直接用{}插值到JSX里即可。

可直接运行的完整参考代码 #

import { useState } from 'react';
// 替换为你项目中实际的PageHeader组件引入路径
import { PageHeader } from 'your-component-lib';

export default function CarManagement() {
  // 响应式存储大小车计数，更新时自动触发页面刷新
  const [bigCarCount, setBigCarCount] = useState<number>(0);
  const [smallCarCount, setSmallCarCount] = useState<number>(0);

  // 修复后的计数更新函数，接收当前车辆是否为小型车的判断参数
  const updateCarTotal = (isSmallCar: boolean) => {
    if (!isSmallCar) {
      // 用函数式更新保证累加值准确，避开闭包陷阱
      setBigCarCount(prevCount => prevCount + 1);
    } else {
      setSmallCarCount(prevCount => prevCount + 1);
    }
  };

  const pageHeader = (
    <PageHeader
      style={{ backgroundColor: "#fff", marginTop: 4 }}
      title="Car Management - Admin"
    >
      {/* 直接插值绑定响应式计数变量展示 */}
      <span>Big Car: {bigCarCount}</span>
      <span style={{ marginLeft: 24 }}>Small Car: {smallCarCount}</span>
    </PageHeader>
  );

  // 业务触发点：识别到车辆时调用updateCarTotal即可
  // 例：识别为大型车传参false，识别为小型车传参true

  return (
    <div className="page-container">
      {pageHeader}
      {/* 其余页面业务代码 */}
    </div>
  );
}

关键注意点 #

• React中所有需要在页面展示的动态值，必须存在state中，普通变量修改不会触发视图更新
• 计数器累加建议用函数式更新写法，避免异步更新时闭包导致的计数不准问题
• JSX中写动态值必须包裹在{}中，静态文本直接写即可
• TS项目中建议给所有变量、参数明确标注类型，减少低级错误

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