SSM+VUE的增删改查

目录

后端代码

mapper.xml

controller

前端代码

api》action.js


后端代码

mapper.xml



  
  
 

controller

package com.zking.spboot.controller;

import com.zking.spboot.model.Book;
import com.zking.spboot.service.IBookService;
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.web.bind.annotation.RequestMapping;
import org.springframework.web.bind.annotation.RestController;

import java.util.HashMap;
import java.util.Map;

/**
 * @author是辉辉啦
 * @create 2023-12-02-16:14
 */
@RestController
@RequestMapping("/book")
public class BookController {
    @Autowired
    private IBookService bookService;

    /**
     * 查询(模糊查询)
     * @param record
     * @return
     */
    @RequestMapping("/list")
    public Map list(Book record){
        Map map = new HashMap();
        map.put("data",bookService.selectLike(record));
        map.put("code",200);
        return map;
    }

    /**
     * 新增
     * @param record
     * @return
     */
    @RequestMapping("/add")
    public Map add(Book record){
        Map map = new HashMap();
        bookService.insert(record);
        map.put("msg","新增成功");
        map.put("code",200);
        return map;
    }


}

后端测试

#查询
http://localhost:8080/spboot/book/list?bookname=红
#新增
http://localhost:8080/spboot/book/add?bookname=111&price=111&booktype=1

前端代码

api》action.js

/**
 * 对后台请求的地址的封装,URL格式如下:
 * 模块名_实体名_操作
 */
export default {
	//服务器
	'SERVER': 'http://localhost:8080/spboot',
  'LIST': '/book/list',
  'ADD': '/book/add',
	//获得请求的完整地址,用于mockjs测试时使用
	'getFullPath': k => {
		return this.SERVER + this[k];
	}
}

views






你可能感兴趣的:(vue.js,elementui,javascript)