三.day5，SpringMVC参数传递单表查询数据库和VUE学习

controller类 @RestController包含@ResponseBody  //将服务端数据转化为JSON串返回

类里方法：URL地址发送请求，请求类型：GET/POST   /   PUT/DELETE

conreoller层代码：

@RestController
//@RequestMapping("user")
//@ResponseBody //将服务端数据转化为JSON串返回
public class UserController {
    //编码规则：面向接口编程（解耦）
    @Autowired
    private UserService userService;
    @RequestMapping("findall")
    public List<User> UserController(){

        return userService.findAll();
    }
/**
     * URL地址: http
     * 请求类型：GET/POST  /   PUT/DELETE
     * 参数：id=1
     * 返回值结果：User对象的json串
     * */
    //@RequestMapping(value = "",method = RequestMethod.GET)
    /**
     *
     *  @PostMapping
     *  @PutMapping
     *  @DeleteMapping
     *  参数说明：
     *  1.参数名称必须与URL中的名称一致
     *  2.SpringMVC可以根据用户的需求，自动实现类型的转换
     *    底层实现：springmvc所有参数默认都是String类型
     *    根据参数类型，自动实现转换
     *
     * */

    @GetMapping("findUserById")
    public User findUserById(Integer id){
        return userService.findUserById(id);

    }

    @GetMapping("find")
    public List<User> find(String name,String sex){
        return userService.find(name,sex);
    }
    /**优化：
     * 规则：SpringMVC 可以利用对象的方式接受
     * 底层实现： 参数name=XXX  拼接set形成setName，
     * 之后检查对象中是否有对应的setName（），如果匹配则给对象赋值
     *注意事项：参数的名称最好与属性名称一致
     *
     * */
    @GetMapping("findNS")
    public List<User> findNS(User user){
        return userService.findNS(user);
    }
    /**RestFul
     *
     * 后端服务器接收规则
     * 1.参数与参数之间用 / 分开
     * 2.参数的位置一旦确定，不改变
     * 3.用｛｝接收参数
     * 4.使用@PathVariable 接收
     * 5.如果参数有多个，建议使用对象接收  《参数必须与属性一致》
     * */
    @GetMapping("/user/{name}/{age}")
    public List<User> findNA(User user){
        return userService.findNA(user);
    }
    @GetMapping("findIds")
    public List<User> findIds(Integer[] ids){
        return userService.findIds(ids);
    }

}

service层实现类代码：

@Service
public class UserServiceImpl implements UserService{
    @Autowired
    private UserMapper userMapper;

    @Override
    public List<User> findAll() {
        return userMapper.selectList(null);
    }

    @Override
    public User findUserById(Integer id) {
        return userMapper.selectById(id);
    }

    @Override
    public List<User> find(String name, String sex) {
        QueryWrapper<User> queryWrapper = new QueryWrapper<>();
        queryWrapper.eq("name", name).eq("sex", sex);
        return userMapper.selectList(queryWrapper);
    }

    @Override
    public List<User> findNS(User user) {
        QueryWrapper<User> queryWrapper = new QueryWrapper<>(user);
        return userMapper.selectList(queryWrapper);
    }

    @Override
    public List<User> findNA(User user) {
        QueryWrapper<User> queryWrapper = new QueryWrapper<>();
        queryWrapper.eq("name", user.getName()).gt("age", user.getAge());
        return userMapper.selectList(queryWrapper);
    }

    @Override
    public List<User> findIds(Integer[] ids) {
        List<Integer> array = Arrays.asList(ids);
        return userMapper.selectBatchIds(array);
    }
}

总结：SpringMVC

1.参数名称必须与URL一致

2.可以根据用户的需求，自动实现类型的转换

   底层实现：springmvc所有参数默认都是String类型，根据参事类型，自动实现转换

3.可以传多个参数（冗余），优化：

规则：SpringMVC 可以利用对象的方式接收

 底层实现：参数name=XX  拼接set形成setName，

之后检查对象中是否有对应的 set参数名()，如果匹配则给对象赋值

springmvc 自动拼接where 判断为null则不拼接

注意事项：参数的名称最好与属性的名称一致

4.如果传入多个相同属性值，传入为数组，springmvc解析集合

需将数组转换为集合

 RestFul参数接收

1. RestFul介绍
REST 指的是一组架构约束条件和原则。满足这些约束条件和原则的应用程序或设计就是 RESTful。
定义: RESTFul 是一种请求的规则(语法/定义)

2. RESTFul说明
Get请求: http://localhost:8090/findUserByNS?name=王昭君&sex=女
信息: 1.查询请求
           2.参数直观 name=xxx
           3.请求的结构冗余. 不合适多个参数的写法.

请求优化:
http://localhost:8090/user/王昭君/女
优势:
1. 用户不能了解请求的意图 规定:请求方法名称不能出现 “动词”,只能写名词.
2. 参数保密, 只有后端服务器清楚参数的意义.
3. 请求字节传输量少 简洁.
注意事项:
1. URL地址中参数与参数之间使用 /分隔.
2. 请求的参数的位置一旦固定,不可轻易修改.
3. 用户发请求时,就应该按照restFul的结构执行.
4. restFul请求一般以get请求为主. put/delete/post
controller代码：

/**
     * 后端服务器接收规则:
     *     1.参数与参数之后使用 /分隔
     *     2.参数的位置一旦确定,一般不变.
     *     3.接收的参数使用 {形参变量}
     *     4.使用@PathVariable 接收
     *     5.如果参数有多个建议使用对象接收  参数必须与属性一致,SpringMVC自动封装
     * 注意事项: 如果名称不统一,则需要转化 具体如下:
     *          @PathVariable("name") String username
     *
     * url: http://localhost:8090/user/貂蝉/10
     * 参数: name/age
     * 返回值: List<User>
     */

    @GetMapping("/user/{name}/{age}")
    public List<User> findUserByNA(User user){

        return userService.findUserByNA(user);
    }




   /*
    说明: restFul写法1
    @GetMapping("/user/{name}/{age}")
    public List<User> findUserByNA(@PathVariable String name,
                                   @PathVariable Integer age){
        System.out.println(name);
        System.out.println(age);

        return null;
    }*/

VUE入门案例

基本语法：

1.导入JS类库

2.是定VUE实例化

3.实例化VUE对象

4.数据取值

1.var/let/const说明

关于JS中变量定义说明:
1.var 没有作用域的概念 容易出现安全性问题. 成员变量
2.let 作用于var类似, 有作用域的概念 局部变量
3.const 定义常量

练习：

            遇到文本框双向绑定数据

           v-text 当页面没有渲染完成时，则不与展示；

           v-html 将html代码片段  渲染展示;

           

<div id="app">
			<!-- 规则说明:  
				1.{{msg}} 当页面没有渲染成功时.以原标签展现.
				2.v-text  当页面没有渲染完成,则不予展现.
				3.v-html  将html代码片段 渲染展现
			 -->
			<h1>{{msg}}</h1>
			<!-- 1.v-text  -->
			<h1 v-text="msg"></h1>
			<!-- 2.v-html -->
			<div v-html="div"></div>
		</div>
		
		<!-- 导包 --><script src="../js/vue.js"></script>
		<script>
			const app = new Vue({
				el: "#app",
				data: {
					msg: "vue入门案例 哈哈哈哈",
					div: "<h3>我是一个标题标签</h3>"
				}
			})
		</script>

v-model 双向绑定

button标签中

v-on:click="简单的计算"

v-on:click="点击事件(vue方法)"

v-if 如果判断为true 则展现元素

v-else-if 如果不满足v-if,检查是否满足v-else-if

v-else 上述都不满足 才展现.

v-for =" 1,2 in 3 "    1遍历出的值，2下标，3要便利的数组