Maven Li.074
Maven 坐标 Maven坐标主要组成 groupld：定义当前Maven项目隶属组织名称（通常是域名反写，例如：org.mybatis) artifactld：定义当前Maven项目名称（通常是模块名称，例如CRM、SMS) version：定义当前项目版本号 Maven 指定本地仓库位置 Maven 软件和指定仓库位置的setting.xml都需要更改 <localRepository>D:\maven\repository</localRepository> Maven 镜像 Maven 软件和指定仓库位置的setting.xml都需要更改 <mirror> <id></id> <mirrorOf>central</mirrorOf> <name></name> <url></url> </mirror> Maven 项目构建命令 # 编译 mvn compile # 清理 mvn clean # 测试 mvn test # 打包 mvn package # 安装到本地仓库 mvn install Maven 插件创建工程 mvn archetype:generate -DgroupId={project-packaging} -DartifactId={project-name} -DarchetypeArtifactId=maven-archetype-quickstart -Dversion={project-version} -DinteractiveMode=false mvn archetype:generate "-DgroupId=com.companyname.bank" "-DartifactId=consumerBanking" "-DarchetypeArtifactId=maven-archetype-quickstart" "-DinteractiveMode=false" Idea 创建空项目 再创建Modules 即可, 可创建多个maven工程 Maven中依赖传递 依赖具有传递性 直接依赖: 在当前项目中通过依赖配置建立的依赖关系 间接依赖: 被依赖的资源如果依赖其他资源, 当前项目间接依赖其他资源 依赖传递冲突问题...
Redis Li.073
Redis 简介 NoSQL NoSQL: 即Not-Only SQL(泛指非关系型的数据库), 作为关系型数据库的补充. 作用: 应对基于海量用户和海量数据前提下的数据处理问题. 特征 可扩容, 可伸缩 大数据量下高性能 灵活的数据模型 高可用 类NoSQL数据库: Redis memcache HBase MongoDB Redis安装与配置 wget https://github.com/redis/redis/archive/7.0.0.tar.gz mkdir -p /opt mv 7.0.0.tar.gz /opt/redis.tar.gz cd /opt tar -xzvf redis.tar.gz cd redis make redis.conf # 需要创建data dir /opt/redis/data #默认端口6379 port 6379 #绑定ip，如果是内网可以直接绑定 127.0.0.1, 或者忽略, 0.0.0.0是外网 bind 0.0.0.0 #守护进程启动 daemonize yes #超时 timeout 300 loglevel notice #分区 databases 16 save 900 1 save 300 10 save 60 10000 rdbcompression yes #存储文件 dbfilename dump....
Vue和Element二Li.072
Vue的自定义组件 自宣言组件: 本质上, 组件是带有一个名称且可复用的Vue实例 Vue.component(组件名称,{ props:组件的属性, data:组件的数据函数, template:组件解析的标签模板 } ) <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>自定义组件</title> <script src="../js2/vue.js"></script> </head> <body> <div id="div"> <my-button>我的按钮</my-button> </div> </body> <script> Vue.component("my-button",{ // 属性 props:["style"] , // 数据函数 data: function (){ return{ msg:"我的按钮" } }, // 解析标签模板 template:"<button style='color:red'>{{msg}}</button>" }); new Vue({ el:"#div" }) </script> </html> Vue的生命周期 生命周期的八个阶段 状态 阶段周期 beforeCreate 创建前 created 创建后 beforeMount 载入前 mounted 载入后 beforeUpdate 更新前 updated 更新后 beforeDestroy 销毁前 destroyed 销毁后 Vue 异步操作 在Vue中发送异步请求, 本质上还是AJAX....
Vue和Element一Li.071
Vue 简介 Vue 是一套构建用户界面的渐进式前端框架。 只关注视图层，并且非常容易学习，还可以很方便的与其它库或已有项目整合。 通过尽可能简单的 API来实现响应数据的绑定和组合的视图组件。 特点 易用：在有HTML CSS JavaScript 的基础上，快速上手。 灵活：简单小巧的核心，渐进式技术栈，足以应付任何规模的应用。 性能：20kb min+gzip运行大小、超快虛拟DOM、最省心的优化。 Vue 入门 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>快速入门</title> </head> <body> <div id="div"> {{msg}} </div> </body> <script src="js/vue.js"></script> <script> // 脚本 new Vue({ el:"#div", data:{ msg:"Hello Vue" } }) </script> </html> Vue 核心对象: 每一个Vue程序都是从一个Vue核心对象开始的 let vm = new Vue({ 选项列表; }) Vue的程序包含视图和脚本两个核心部分 选项列表 el选项: 用于接收获取到页面中的元素.(根据常用选择器获取) data选项: 用于保存当前Vue对象中的数据. 在视图中声明的变量需要在此处赋值 methods选项: 用于定义方法. 方法可以直接通过对象名调用, this代表当前Vue对象 数据绑定 在视图部分获取脚本部分的数据 {{变量名}} <!...
AJAX Li.070
AJAX 介绍 AJAX(Asynchronous JavaScript And XML): 异步的JavaScript和XML 本身不是新技术, 而是多个技术的综合. 用于快速创建动态网页的技术. 一般的负面如果需要更新内容, 必需重新加载整个页面 而AJAX通过浏览器与服务器进行少量数据交换, 不可以使网页异步更新. 不重新加载整个页面, 对网页部分内容局部更新 原生JavaScript 实现AJAX 核心对象：xMLHttpRequest 用于在后台与服务器交换数据。可以在不重新加载整个网页的情况下，对网页的某部分进行更新。 打开链接：open(method,url,async) method ：请求的类型 GET 或 POST. url：请求资源的路径, async：true(异步) 或false(同步）。 发送请求：send(String params) params：请求的参数(POST 专用）。 处理响应：onreadystatechange readyState ：0-请求末初始化，1-服务器连接已建立，2-请求已接收 ，3-请求处理中，4-请求已完成，且响应已就绪。 status：200-响应已全部OK。 获得响应数据形式 response Text ：获得字符串形式的响应数据。 responseXML：获得XML形式的响应 jQuery的Get方式实现AJAX 核心语法：$.get(url,[data],[callback],[type]); url：请求的资源路径 data：发送给服务器端的请求参数，格式可以是key=value，也可以是js对象 callback ：当请求成功后的回调函数，可以在函数中编写我们的逻辑代码 type : 预期的返回数据的类型, 取值可以是xml, html, js, ison, text等 @WebServlet("/userServlet") public class UserServlet extends HttpServlet { @Override protected void doGet(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException { req....
jQuery二Li.069
jQuery DOM 常用方法 方法 作用 html() 获取标签的文本 html(value) 设置标签的文本内容,解析标签 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>操作文本</title> </head> <body> <div id="div">我是div</div> <input type="button" id="btn1" value="获取div的文本"> <input type="button" id="btn2" value="获取div的文本"> </body> <script src="../jQuery/jquery-3.6.0.js"></script> <script> // html() 获取标签的文本 let div = $("div"); // html(value) 设置标签的文本内容,解析标签 let btn1 = $("#btn1") btn1.click(cc1) function cc1() { alert(div.html()) } let btn2 = $("#btn2") btn2.click(cc2) function cc2(){ div.html("<b>小明</b>") } </script> </html> jQuery 操作对象 方法 作用 $("元素") 创建指定元素 append(element) 添加成最后一个子元素,由添加者对象调用 appendTo(element) 添加成最后一个子元素,由被添加者对象调用 prepend(element) 添加成第一个子元素,由添加者对象调用 prependTo(element) 添加成第一个子元素,由被添加者对象调用 before(element) 添加到当前元素的前面,两者是兄弟关系,由添加者对象调用 after(element) 添加到当前元素的后面,两者之间是兄弟关系,由添加者对象调用 remove() 删除指定元素(自己移除自己) empty() 清空指定元素的所有子元素 <!...
jQuery一Li.068
jQuery 介绍 jQuery是一个JavaScript库 封装了很多预定义的函数, 获取元素, 执行隐藏移动等 目的就是在使用时直接调用, 不需要再重复定义, 这样就可以极大地简化了JavaScript编程 jQuery 快速入门 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>快速入门jQuery</title> </head> <body> <div id="div">我是div</div> </body> <script src="../jQuery/jquery-3.6.0.js"></script> <script> // let div = document.getElementById("div"); // alert(div.innerText) // jQuery 方式 let jqDiv = $("#div"); alert(jqDiv) alert(jqDiv.html()) </script> </html> JS对象和jQuery对象黑的 jQuery本质上虽然也是JS, 但如果想使用jQuery的属性和方法那么必须保证对象是jQuery对象, 而不是JS方式获得的DOM对象 二者的API方法不能混合使用, 若想使用对方的API, 需要进行对象转换 JS的DOM对象黑的成jQuery对象 $(JS的DOM对象); jQuery对象转换成jQuery对象 jQuery对象[索引]; jQuery对象.get(索引); <body> <div id="div">我是div</div> </body> <script src="../jQuery/jquery-3.6.0.js"></script> <script> // js 方式, 通过id获取div元素 // JS对象 转换 jQuery对象 let div1 = document....
JavaScript二Li.067
JavaScript 面向对象, 类的定义和使用 定义格式 class 类名{ constructor(变量列表){ 变量赋值; } 方法名(参数列表){ 方法体; return 返回值; } } <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>类的定义和使用</title> </head> <body> </body> <script> class Person{ constructor(name,age) { this.name = name this.age = age } // show method show(){ document.write(this.name+" "+this.age+"<br/>"); } eat(){ document.write("吃饭<br>"); } } let p = new Person("张三",23) p.show() p.eat() </script> </html> 字面量定义类和使用 let 对象名 = { 变量名 : 变量值, 变量名 : 变量值, ... 方法名 : function(参数列表){ 方法体; return 返回值; } ....