从javascript代码中获取数据到blazor中的razor页面代码

// 获取数据的函数
function getDataFromServer() {
  // 使用AJAX请求获取数据
  // 假设数据为一个JSON对象 { "name": "John", "age": 30 }
  // 这里使用了jQuery的AJAX方法来发送请求，你也可以使用其他方法
  $.ajax({
    url: '/api/data', // 数据接口的URL
    method: 'GET',
    success: function(data) {
      // 将获取到的数据传递给Blazor组件
      DotNet.invokeMethodAsync('MyBlazorApp', 'ReceiveData', data);
    },
    error: function(error) {
      console.error('Failed to get data from server:', error);
    }
  });
}

@page "/my-page"

<h3>My Page</h3>

<p>Name: @person.Name</p>
<p>Age: @person.Age</p>

@code {
  private Person person = new Person();

  // 接收数据的方法
  [JSInvokable]
  public void ReceiveData(dynamic data)
  {
    // 更新页面上的数据
    person.Name = data.name;
    person.Age = data.age;
  }

  public class Person
  {
    public string Name { get; set; }
    public int Age { get; set; }
  }
}