Vaadin Hilla开发报错：类型PersonDetails不存在属性'call'

这个错误的核心原因是你在TypeScript代码里误将数据传输对象（DTO）PersonDetails当成了Endpoint服务类来调用——PersonDetails只是用来承载数据的结构定义，没有call方法，call是自动生成的Endpoint客户端类（比如PersonEndpoint）的方法。

解决步骤： #

1. 确认自动生成的TypeScript类型
   Hilla会自动为你的Java代码生成对应的TS类型：

• PersonDetails是一个TS接口，仅定义人员信息的结构
• PersonEndpoint是包含savePerson调用方法的客户端类，位于Frontend/generated/endpoints路径下

2. 正确创建并赋值PersonDetails对象
   从文本框获取值，构建符合PersonDetails结构的对象：

// 假设PersonDetails包含name、email属性
const person: PersonDetails = {
  name: (document.getElementById('name-input') as HTMLInputElement).value,
  email: (document.getElementById('email-input') as HTMLInputElement).value
};

3. 调用Endpoint的save方法
   通过自动生成的PersonEndpoint类调用savePerson，而不是操作PersonDetails：

import { PersonEndpoint } from 'Frontend/generated/endpoints';

// 定义保存函数
async function handleSave() {
  const person: PersonDetails = {
    name: (document.getElementById('name-input') as HTMLInputElement).value,
    email: (document.getElementById('email-input') as HTMLInputElement).value
  };

  try {
    const result = await PersonEndpoint.savePerson(person);
    console.log('保存结果:', result);
    // 这里可以添加成功后的UI反馈，比如清空输入框、提示消息
  } catch (err) {
    console.error('保存失败:', err);
  }
}

4. 排查并修正错误代码
   检查你的TS代码，找到类似PersonDetails.call(...)或者把PersonDetails当作服务调用的代码，替换成上述正确的PersonEndpoint.savePerson调用方式。

额外注意：Java端PersonDetails的正确性 #

确保你的PersonDetails类是标准的DTO：

• 提供无参构造器（Hilla序列化需要）
• 为所有属性提供getter/setter，或者使用Java Record（自动生成这些方法）：

// 推荐使用Record简化DTO
public record PersonDetails(String name, String email) {}

// 或者普通类写法
public class PersonDetails {
    private String name;
    private String email;

    public PersonDetails() {}

    public String getName() { return name; }
    public void setName(String name) { this.name = name; }
    public String getEmail() { return email; }
    public void setEmail(String email) { this.email = email; }
}

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