后端数据库（postgresql）向前端(鸿蒙)传输数据（二）

于 2025-03-08 22:15:29 发布
阅读量327 收藏 5
点赞数 3
文章标签： 数据库 java spring boot postgresql idea 前端 鸿蒙
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.youkuaiyun.com/2301_80223125/article/details/146122713
版权

一、明确需求分析，创建数据库

这里给出一个例子：

我们想要将或得到的一些数据（班级成员姓名、年龄、手机号）存到数据库里面，并且在前端鸿蒙里面显示这些存在数据库里面的数据。

二、编写后端代码

首先我们应该创建项目确定项目所需要的依赖，这里最好是在创建项目的时候进行依赖的选择，否则后期导入的时候会因为版本冲突，造成很多错误。

1.创建项目+依赖选择

      进入idea软件左上角点击新建文件，选择spring boot框架，注意这里展示的是Java语言和maven类型，一定要选对！！！

      注意选择依赖的话前两个是必须选择的，但是后两个是数据库相关的，如果不涉及数据库操作，那么就可以不选，否则会在后续一些项目运行中报错。

 接下来可以按照这个创建文件夹

 

2.先定义实体类

package com.yy.entity;

import lombok.Data;
import org.springframework.stereotype.Component;

import java.sql.Date;

@Data
@Component
public class Student {
    private String studentName;
    private Integer age;
    private String phoneNumber;

    public String getStudentName() {
        return studentName;
    }

    public void setStudentName(String studentName) {
        this.studentName = studentName;
    }

    public Integer getAge() {
        return age;
    }

    public void setAge(Integer age) {
        this.age = age;
    }

    public String getPhoneNumber() {
        return phoneNumber;
    }

    public void setPhoneNumber(String phoneNumber) {
        this.phoneNumber = phoneNumber;
    }

    @Override
    public String toString() {
        return "Student{" +
                "studentName='" + studentName + '\'' +
                ", age=" + age +
                ", phoneNumber='" + phoneNumber + '\'' +
                '}';
    }
}

 3.服务接口 StudentService

package com.yy.service;

import com.yy.entity.Student;
import org.springframework.stereotype.Service;

import java.util.List;

@Service
public interface StudentService {
    List<Student> getAllStudents();
    List<Student> getStudentsByKeyword(String keyword);
}

 4.服务实现类 StudentServiceImpl

package com.yy.service.impl;

import com.yy.entity.Student;
import com.yy.mapper.StudentMapper;
import com.yy.service.StudentService;
import org.slf4j.Logger;
import org.slf4j.LoggerFactory;
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.stereotype.Service;

import java.util.List;

@Service
public class StudentServiceImpl implements StudentService {

    private static final Logger logger = LoggerFactory.getLogger(StudentServiceImpl.class);

    @Autowired
    private StudentMapper studentMapper;

    @Override
    public List<Student> getAllStudents() {
        List<Student> students = studentMapper.getAllStudents();
        logger.info("查询到的学生记录数量: {}", students.size());
        for (Student student : students) {
            logger.info("学生记录: {}", student);
        }
        return students;
    }

    @Override
    public List<Student> getStudentsByKeyword(String keyword) {
        List<Student> students = studentMapper.getStudentsByKeyword(keyword);
        logger.info("根据关键词 '{}' 查询到的学生记录数量: {}", keyword, students.size());
        for (Student student : students) {
            logger.info("学生记录: {}", student);
        }
        return students;
    }
}

5.Mapper 接口 StudentMapper

package com.yy.mapper;

import com.yy.entity.Student;
import org.apache.ibatis.annotations.Mapper;
import org.apache.ibatis.annotations.Result;
import org.apache.ibatis.annotations.Results;
import org.apache.ibatis.annotations.Select;

import java.util.List;

@Mapper
public interface StudentMapper {

    @Select("SELECT student_name, age, phone_number FROM student")
    @Results({
            @Result(column = "student_name", property = "studentName"),
            @Result(column = "age", property = "age"),
            @Result(column = "phone_number", property = "phoneNumber")
    })
    List<Student> getAllStudents();

    @Select("SELECT student_name, age, phone_number FROM student " +
            "WHERE student_name LIKE CONCAT('%', #{keyword}, '%') " +
            "OR CAST(age AS CHAR) LIKE CONCAT('%', #{keyword}, '%') " +
            "OR phone_number LIKE CONCAT('%', #{keyword}, '%')")
    @Results({
            @Result(column = "student_name", property = "studentName"),
            @Result(column = "age", property = "age"),
            @Result(column = "phone_number", property = "phoneNumber")
    })
    List<Student> getStudentsByKeyword(String keyword);
}

6.进行controller层代码的编写

package com.yy.controller;

import com.yy.entity.Student;
import com.yy.service.StudentService;
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.web.bind.annotation.GetMapping;
import org.springframework.web.bind.annotation.RequestParam;
import org.springframework.web.bind.annotation.RestController;

import java.util.List;

@RestController
public class StudentController {

    @Autowired
    private StudentService studentService;

    @GetMapping("/student")
    public List<Student> getStudents(@RequestParam(required = false) String keyword) {
        if (keyword == null || keyword.isEmpty()) {
            return studentService.getAllStudents();
        }
        return studentService.getStudentsByKeyword(keyword);
    }
}

 三、鸿蒙前端撰写+界面显示

 下面是一个简单的鸿蒙前端代码展示，可以测试链接一下。

//import { Component, Entry, State, onInit } from '@ohos';
import { http } from '@kit.NetworkKit';
import { BusinessError } from '@kit.BasicServicesKit';
import router from '@system.router';

// 定义学生记录的数据类型
interface Student {
  studentName: string;
  age: number;
  phoneNumber: string;
}

async function fetchStudents(keyword: string = ''): Promise<Student[]> {
  return new Promise((resolve, reject) => {
    let httpRequest = http.createHttp();
    let url = "http://localhost:8080/student";
    if (keyword) {
      url += `?keyword=${keyword}`;
    }
    httpRequest.on('headersReceive', (header) => {
      // 可按需处理响应头信息
    });
    httpRequest.request(
      url,
      {
        method: http.RequestMethod.GET,
        header: {
          'Content-Type': 'application/json'
        }
      },
      (err: BusinessError, data: http.HttpResponse) => {
        if (!err) {
          try {
            // 解析响应数据
            const responseData = JSON.parse(data.result.toString()) as Student[];
            // 成功获取数据，将其作为 Promise 的结果返回
            resolve(responseData);
          } catch (parseError) {
            // 解析数据出错，拒绝 Promise 并传递错误信息
            reject(parseError);
          } finally {
            // 无论请求成功与否，都销毁请求对象
            httpRequest.destroy();
          }
        } else {
          console.error('error:' + JSON.stringify(err));
          // 取消订阅 HTTP 响应头事件
          httpRequest.off('headersReceive');
          // 销毁请求对象
          httpRequest.destroy();
          // 请求出错，拒绝 Promise 并传递错误信息
          reject(err);
        }
      }
    );
  });
}

@Entry
@Component
struct StudentList {
  @State students: Student[] = [];
  @State keyword: string = '';

  async aboutToAppear() {
    try {
      const data = await fetchStudents(this.keyword);
      this.students = data;
    } catch (error) {
      console.error('Error fetching students:', error);
    }
  }

  async onSearch() {
    try {
      const data = await fetchStudents(this.keyword);
      this.students = data;
    } catch (error) {
      console.error('Error fetching students:', error);
    }
  }

  build() {
    Column({space:10}) {
      // 搜索框
      Row({space:15}) {
        TextInput({
          placeholder: '请输入关键词',
        })
          .onChange((value: string) => {
          this.keyword = value;
        })
          .width("75%")
        Button('搜索')
          .onClick(() => {
            this.onSearch();
          })
      }
      // 表头
      Row() {
        Text('学生姓名')
          .width('30%')
          .textAlign(TextAlign.Center)
          .backgroundColor('#ccc')
        Text('年龄')
          .width('30%')
          .textAlign(TextAlign.Center)
          .backgroundColor('#ccc')
        Text('手机号')
          .width('40%')
          .textAlign(TextAlign.Center)
          .backgroundColor('#ccc')
      }
      List() {
        ForEach(this.students, (item: Student, index: number) => {
          ListItem() {
            Row() {
              Text(item.studentName)
                .width('30%')
                .textAlign(TextAlign.Center)
              Text(item.age.toString())
                .width('30%')
                .textAlign(TextAlign.Center)
              Text(item.phoneNumber)
                .width('40%')
                .textAlign(TextAlign.Center)
            }
            
            
          }
        }, (item: Student) => JSON.stringify(item))
      }
    }
    .width('100%')
  }
}

四、总结 

首先，要明确你的需求分析（要调用什么数据），才能够写你的实体类，一般我们把在数据库查找或者其他操作的SQL代码写到Mapper接口里面，接着就是写你的逻辑处理层service层函数，最后写你controller层代码。

评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值