2024/11/27日 日志 关于Vue && Element

合集 - Javaweb(54)

1.2024/10/16 日 日志 --》关于MySQL的中 基础操作的整理以及 DQL的初步学习笔记与整理2024-10-162.2024/10/17日 日志 --》关于MySQL中的 约束、多表查询的初步学习笔记与整理2024-10-173.2024/10/18日 日志 --》关于MySQL中的 事务 以及JDBC的初步学习笔记与整理2024-10-184.2024/10/19日 日志--》关于MySQL中 JDBC的API 详解的整理简述2024-10-195.2024/10/21 日 日志 --》关于Mysql中的数据库连接池 简述笔记整理2024-10-216.2024/10/22日 日志 --》关于Maven的基础学习 笔记整理2024-10-227.2024/10/23日 日志--》关于Maven的基础学习--2 坐标与依赖范围2024-10-238.2024/10/24日 日志 --》关于Mybatis的学习笔记整理 - 环境与性质 以及ResultMap2024-10-249.2024/10/25日 日志 --》关于使用Mybatis进行增删改查 ---1 查询2024-10-2510.2024/10/26 日 使用Mybatic --》关于Mybatis 进行增删改查 ---2 添加、修改与删除2024-10-2611.2024/10/28日 使用Mybatic --》关于Mybatis 的参数传递与注解开发2024-10-2812.2024/10/29 HTML --》关于HTML的快速入门与标签2024-10-2913.2024/10/30 日 日志 --》关于CSS的学习2024-10-3114.2024/11/1日 日志 关于JavaScript简介&引入方式 以及基础语法的学习2024-11-0215.2024/11/4日 日志 关于JavaScript 变量、数据类型、类型转换和流程控制语句以及对象的学习2024-11-0416.2024/11/5日 日志 关于BOM浏览器对象模型和DOM文档对象模型的学习与笔记整理2024-11-0517.2024/11/6日 日志 正则表达式,web与HTTP2024-11-0618.2024/11/7日 日志 Tomcat简介&基本使用2024-11-0719.2024/11/8日 日志 关于Servlet ----（上）2024-11-0820.2024/11/11日 日志 关于Servlet ----HttpServlet（下）2024-11-1121.2024/11/12日 日志 关于Servlet ---- Request(请求)& Response(响应) 的补充2024-11-1222.2024/11/13日 日志 代码优化 以及 JSP 的快速入门、原理、脚本、缺点 和 EL表达式 以及 JSTL标签2024-11-1423.2024/11/14日 日志 关于 MVC 分层开发模式2024-11-1424.2024/11/15日 日志 关于 会话跟踪技术--- Cookie & Session2024-11-1625.2024/11/20日 日志 关于 Filter & Listener2024-11-2126.2024/11/21日 日志 关于AJAX & Axious异步框架 & JSON2024-11-22

27.2024/11/27日 日志 关于Vue && Element2024-11-28

28.JavaWeb案例整体分析---》差旅费报销管理信息系统->>题目详情2024-12-2229.JavaWeb案例整体分析---》差旅费报销管理信息系统->>登录与注册2024-12-2230.JavaWeb案例整体分析---》差旅费报销管理信息系统->>数据库操作和Mybatis配置以及pom.xml2024-12-2231.JavaWeb案例整体分析---》差旅费报销管理信息系统->>出差申请与报销部分2024-12-2232.2024/1/13日 日志 关于Vue && Element 的后续---》综合案例（1）02-1733.2024/1/14日 日志 关于Vue && Element 的后续---》综合案例（2）02-1734.2024/1/16日 日志 关于Vue && Element 的后续---》综合案例（4）02-1735.2024/1/17日 日志 关于Vue && Element 的后续---》综合案例（5）02-1736.2024/1/18日 日志 关于Vue && Element 的后续---》综合案例（6）02-1737.2024/1/19日 日志 关于Vue && Element 的后续---》综合案例（7）02-1738.2024/1/20日 日志 关于Vue && Element 的后续---》综合案例（8.1）02-1739.2024/1/21日 日志 关于Vue && Element 的后续---》综合案例（8.2）02-1740.2024/1/22日 日志 期末考试案例回顾与分析---》综合案例（1）02-1741.2024/1/23日 日志 期末考试案例回顾与分析---》综合案例（2）02-1842.2024/1/24日 日志 期末考试案例回顾与分析---》综合案例（3）02-1843.2024/1/25日 日志 期末考试案例回顾与分析---》综合案例（4）02-1844.2024/1/26日 日志 期末考试案例回顾与分析---》综合案例（5）02-1845.2024/1/27日 日志 期末考试案例回顾与分析---》综合案例（6）02-1846.2024/2/3日 日志 期末考试案例回顾与分析---》综合案例（7）02-1847.2024/2/4日 日志 期末考试案例回顾与分析---》综合案例（8）02-1848.2024/2/5日 日志 期末考试案例回顾与分析---》综合案例（9）02-1849.2024/2/6日 日志 期末考试案例回顾与分析---》综合案例（10）02-1850.2024/2/7日 日志 期末考试案例回顾与分析---》综合案例（汇总）02-1851.2024/2/24日 日志 第一次测试案例分析(1)--题目02-2752.2024/2/25日 日志 第一次测试案例分析(2)--数据库层面02-2753.2024/2/26日 日志 第一次测试案例分析(3)--基础准备02-2754.2024/2/27日 日志 第一次测试案例分析(4)--登录与注册和仓库方面02-27

收起

Vue

点击查看代码

-- Vue
-- ·Vue 是一套前端框架免除原生JavaScript中的DOM操作，简化书写
-- ·基于MVVM(Model-View-ViewModel)思想,实现数据的双向绑定,
--  将编程的关注点放在数据上
-- ·官网:https://cn.vuejs.org
-- 
-- Vue 快速入门
-- 1.新建 HTML 页面，引入 Vue.js文件
-- <script src="js/vue.js"></script>
-- 2.在JS代码区域，创建Vue核心对象，进行数据绑定
-- new Vue({
-- 	el: "#app",
-- 	data() {
-- 			return {
--    	username:""
--    	}
--  	}
-- });
-- 3. 编写视图
-- <div id="app">
-- <input name="username" v-model="username" >
-- {{username}}
-- </div>
-- 
-- Vue 常用指令
-- ·指令:HTML 标签上带有 v- 前缀的特殊属性，不同指令具有不同含义。
-- 	例如:v-if，v-for...
-- ·常用指令
-- 指令          作用
-- v-bind        为HTML标签绑定属性值，如设置 href，css样式等
-- v-model       在表单元素上创建双向数据绑定
-- v-on          为HTML标签绑定事件
-- v-if
-- v-else        条件性的渲染某元素，判定为true时渲染,否则不渲染
-- v-else-if
-- v-show        根据条件展示某元素，区别在于切换的是display属性的值
-- v-for         列表渲染，遍历容器的元素或者对象的属性
-- 
-- 
-- ·v-bind:
-- <a v-bind:href-"ur">百度一下</a>
-- <!--
-- v-bind 可以省略
-- -->
-- <a :href="url">百度一下</a>
-- 
-- ·v-model:
-- <input name="username" v-model="username">
-- 
-- ·html:
-- <input type="button" value="一个按钮" v-on:click="show()">
-- <input type="button" value="一个按钮" @click="show()">
-- ·vue:
-- new Vue({
-- 		el: "#app",
-- 		methods:{
-- 		show(){
-- 			alert("我被点了");
--    }
--   }
-- });
-- 
-- ·v-if:
-- <div v-if="count == 3">div1</div>
-- <div v-else-if"count == 2">div2</div>
-- <div v-else>div3</div>
-- 
-- ·v-show:
-- <div v-show="count == 3">div4</div>
-- 
-- ·v-for:
-- <div y-for="addr in addrs">
-- 	{{addr}}<br>
-- </div>
-- ·加索引
-- <div v-for="(addr,i) in addrs">
-- <!--i表示索引，从0开始-->
-- {i + 1} : {{addr}}<br>
-- </div>
-- 
-- Vue生命周期
-- 生命周期的八个阶段:每触发一个生命周期事件，会自动执行一个生命周期方法(钩子)
-- 状态             阶段周期
-- beforeCreate     创建前
-- created          创建后
-- beforeMount      载入前
-- mounted          挂载完成
-- beforeUpdate     更新前
-- updated          更新后
-- beforeDestroy    销毁前
-- destroyed        销毁后
-- 关键：
-- ·mounted:挂载完成，Vue初始化成功，HTML页面渲染成功:
-- 	发送异步请求，加载数据
-- 
-- 示例:
-- 	new Vue({
-- 		el:"#app"，
-- 		mounted(){
-- 		alert("vue 挂载完毕，发送异步请求");
-- 		} 
-- 	});
-- 

Element

点击查看代码

-- Element
-- 
-- ·Element:是饿了么公司前端开发团队提供的一套基于Vue的网站组件库，
--  	用于快速构建网页
-- ·组件:组成网页的部件，例如 超链接、按钮、图片、表格等等~
-- 
-- Element 快速入门
-- 1.引入Element 的css、js文件 和 Vue.js
-- <script src="vue.js"></script>
-- <script src="element-ui/lib/index.js"></script>
-- <link rel="stylesheet" href="element-ui/lib/theme-chalk/index.css">
-- 2.创建Vue核心对象
-- <script>
-- 	new Vue({
-- 		el:"#app
-- 	})
-- </script>
-- 3.官网复制Element组件代码
-- 
-- Element 布局
-- Element 中有两种布局方式
-- Layout 布局:通过基础的 24 分栏，迅速简便地创建布局
-- Container 布局容器:用于布局的容器组件，方便快速搭建页面的基本结构