代码如下:

try {
      const res: AxiosResponse<Order> =
        await axios.post('http://localhost:8080/api/order/update', order);
      console.log("res",JSON.stringify(res));
      console.log("res.data", res.data); // 只打印数据部分
      this.resp = `更新成功:\n${JSON.stringify(res.data, null, 2)}`;
    } catch (err) {
      this.resp = `更新失败:${err}`;
    }

完整的例子代码如下:

import axios, { AxiosResponse } from '@ohos/axios';
import { shippingAddress } from '@kit.AccountKit';
interface user1{
  id:number
  name:string
}

interface address1{
  city:string
  street:string
}


interface Order {
  id: number;
  user: user1;
  address: address1;

}

@Entry
@Component
struct OrderUpdatePage {
  @State orderId: string = '';
  @State itemName: string = '';


  @State city: string = '';
  @State street: string = '';
  @State user: user1 = {} as user1;
  @State address: address1 = {} as address1;



@State resp: string = '等待服务器响应…';

  // ======================
  // 1. 查询订单
  // ======================
  loadOrder = async () => {
    if (!this.orderId) {
      this.resp = '请输入订单号';
      return;
    }

    try {
      const res: AxiosResponse<Order> =
        await axios.get(`http://localhost:8080/api/order/${this.orderId}`);

      console.log("res1",JSON.stringify(res))
      const data = res.data;
      this.itemName = "ko";
      this.user = data.user;
      this.address = data.address;
      this.address.city=data.address.city

      this.resp = `查询成功:\n${JSON.stringify(data, null, 2)}`;
    } catch (err) {
      this.resp = `查询失败:${err}`;
    }
  }

  // ======================
  // 2. 修改订单
  // ======================
  updateOrder = async () => {
    this.resp='ok'
    const order: Order = {
      id: Number(this.orderId),
      user: this.user,
      address:this.address
    };

    try {
      const res: AxiosResponse<Order> =
        await axios.post('http://localhost:8080/api/order/update', order);
      console.log("res",JSON.stringify(res));
      console.log("res.data", res.data); // 只打印数据部分
      this.resp = `更新成功:\n${JSON.stringify(res.data, null, 2)}`;
    } catch (err) {
      this.resp = `更新失败:${err}`;
    }
  };

  build() {
    Column({ space: 14 }) {
      Text('订单管理')
        .fontSize(26)
        .fontWeight(FontWeight.Bold)
        .margin({ bottom: 18 });
      // 输入订单号
      TextInput({ placeholder: '订单号', text: $$this.orderId })
        .type(InputType.Number)
      Button('查询订单')
        .width('100%')
        .height(44)
        .onClick(this.loadOrder)
      // 修改字段
      TextInput({ placeholder: '订单', text: $$this.orderId });
      TextInput({ placeholder: '商品名', text: $$this.itemName });
      TextInput({ placeholder: '用户id', text: $$this.user.id })
      TextInput({ placeholder: '用户name', text: $$this.user.name })
      // TextInput({ placeholder: '用户', text: $$this.user })
      TextInput({ placeholder: 'address.city', text: $$this.address.city })
      TextInput({ placeholder: 'address.street', text: $$this.address.street })
      Button('更新订单')
        .width('100%')
        .height(34)
        .onClick(this.updateOrder)
      // 服务端回显
      Text('服务器回显:')
        .fontSize(16)
        .fontWeight(FontWeight.Medium)
      Scroll() {
        Text(this.resp)
          .fontSize(14)
          .padding(10)
          .backgroundColor('#F5F5F5')
          .borderRadius(8)
          .maxLines(999)
          .textOverflow({ overflow: TextOverflow.Clip });
      }
      .height('45%')
      .width('100%')
    }
    .padding(20)
    .width('100%')
    .height('100%')
    .backgroundColor('#FFFFFF');
  }
}

Logo

讨论HarmonyOS开发技术,专注于API与组件、DevEco Studio、测试、元服务和应用上架分发等。

更多推荐