-
Notifications
You must be signed in to change notification settings - Fork 0
/
search.xml
35 lines (35 loc) · 15.1 KB
/
search.xml
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
<?xml version="1.0" encoding="utf-8"?>
<search>
<entry>
<title><![CDATA[deploy-javaweb-application-on-tomcat]]></title>
<url>%2F2017%2F12%2F10%2Fdeploy-javaweb-application-on-tomcat%2F</url>
<content type="text"><![CDATA[上一次把JavaWeb项目做好后只是部署在本地，还没部署到tomcat上。在整个流程中遇到了几个问题，在此记一笔。 jar依赖的位置问题，要添加到项目的lib下（上一次的文章有提到） JDK版本问题，vps上的为Java8，本地使用的是Java9，导致相关类无法解析。 IDEA中修改JDK后，需重新选择支持的jdk的language-level 在本机上同时安装java8和java9的jdk，结果导致tomcat出错。更新tomcat环境变量后解决 整个过程也有很多收获，首先是认识到了IDEA中一个JavaWeb项目的构建过程，其次是知道了Java作为后端怎么取得http的相关数据，也知道了如果使用Java调用mysql数据库，同时对数据库增删查改更加熟练，最后终于完成了一个可访问的接口。再也不必使用fakerjs，之类的了。]]></content>
<tags>
<tag>JavaWeb Tomcat</tag>
</tags>
</entry>
<entry>
<title><![CDATA[VueSummary-basic.1]]></title>
<url>%2F2017%2F12%2F09%2FVueSummary-basic%2F</url>
<content type="text"><![CDATA[新建对象 var app = new Vue({ el…各种属性}) vue实例的生命周期 created mounted updated destoryed beforeCreate beforeMount beforeUpdate beforeDestory el 指向绑定对象 常用’#app’ data 对象绑定的数据 组件的时候必须是函数返回一个对象 文本的处理 mustache语法 用在HTML标签之间, 可以使用简单js相等判断, 条件表达式等. 不能使用语句”;” 直接输出HTML v-html="rawHtml" rawHtml为HTML格式字符串 直接替换所在HTML标签 指令 v-bind:title = "yourTitle" 将title绑定到data数据中的yourTitle 缩写 :title="yourTitle" 用来绑定一个属性attribute 使用内连字符串<img :src="'/path/to/images/' + fileName"> 绑定class 对象语法<div :class="{ red: isRed }"></div> <div :class="{ 'text-danger': TrueOrFalse }"></div> 对象语法是先写一个属性, 再用data里面的数据决定是否加载这个属性 数组语法<div :class="[classA, classB]"></div> 数组语法是直接将Tag属性与data里面的数据绑定, 直接决定加载这个属性了 数组+对象<div :class="[classA,{classB: isB, classC: isC }]"> 绑定style 对象语法<div :style="{ fontSize: size + 'px' }"></div> 先写一个属性, 再由data里面的数据决定这个属性值是多少 可直接绑定对象 数组语法<div :style="[styleObjectA, styleObjectB]"></div> 绑定多个style 数组+对象<div :style="[{ fontSize: size + 'px' }, styleObjectB]"></div> v-if="a" 将HTML标签显示与否绑定到data数据中的a的 true | false 和v-else一起使用 和模板使用决定一个小部分的渲染与否 v-if1234<h1>Title</h1> <p>Paragraph 1</p> <p>Paragraph 2</p> </template> 通过赋予tag key值防止复用 v-if是惰性的, 只有当条件改变时, 才渲染 v-show=”signal” 是改变 display:none 变异方法 push pop shift unshift splice sort reverse 非变异 filter concat slice 直接通过数组下标赋值或改变数组长度也属于非变异 通过Vue.set(example1.items, indexOfItem, newValue)触发 通过this.$set(this.userProfile, ‘age’, 27)触发 Vue 不能检测对象属性的添加或删除 v-for 列表渲染 items是对象数组 12345<ul id="example-1"> <li v-for="(item, index) in items" :key=item.id> {{ item.message }}-{{ index }} </li></ul> object为对象 { key: value } 12345<ul id="v-for-object" class="demo"> <li v-for="(value, key, index) in object" > {{ value }} - {{ key }}- {{ index }} </li></ul> 连续整数 123<div> <span v-for="n in 10">{{ n }} </span></div> 和if类似重复一部分 123456 <ul> <template v-for="item in items"> <li>{{ item.msg }}</li> <li class="divider"></li> </template></ul> v-for 的优先级比 v-if 更高 123 <li v-for="todo in todos" v-if="!todo.isComplete"> {{ todo }}</li> v-on:click v-on:click=”n = n + 1” 直接运行表达式 v-on:click=”yourmethod” HTML标签点击后调用data中的yourmethod 123456//v-on:click="yourmethod('balabalabala', $event)"> yourmethod: function (message, event) { // 可传递信息和事件对象, 访问原生事件对象 if (event) event.preventDefault() alert(message)} 可简写 @click 可使用事件修饰符.stop .prevent .once .capture .self 可使用按键修饰符.enter .tab .up .down .left .right .delete .esc .space @keyup.13=”submit” <input @keyup.alt.67="clear"> 2.1 .ctrl .alt .shift .meta 鼠标 .left .right .middle .exact 精确匹配 只有唯一起作用 排除组合键 表单输入绑定 v-model input文本 <input v-model="message" placeholder="edit me"> textarea多行文本 <textarea v-model="message" placeholder="add multiple lines"></textarea> 单个复选框<input type="checkbox" id="checkbox" v-model="checked"> checked = true || false 多个复选框 123456<div id='example'> <input type="checkbox" id="jack" value="Jack" v-model="checkedNames"> <label for="jack">Jack</label> <input type="checkbox" id="john" value="John" v-model="checkedNames"> <label for="john">John</label></div> checkedNames =["Jack", "John"]; 单选按钮 1234<div id="example"><input type="radio" id="one" value="One" v-model="picked"> <input type="radio" id="two" value="Two" v-model="picked"></div> picked = "One" || "Two" 单选列表 1234567<div id="example"><select v-model="selected"> <option disabled value="">请选择</option> <option>A</option> <option>B</option></select> selected = "A" || "B"</div> 多选列表 multiple 结果是数组 修饰符 .lazy .trim .number <input v-model.number="age" type="number"> 组件 全局组件 Vue.component('my-component', template: '<div>A custom component!</div>') 局部组件 new Vue({ components: { 'my-component': {template: '',data: function} } }) 使用is绑定模板 <tr is="my-row"></tr> 子组件使用prop:[‘yourMessage’] 接受数据。:your-message=’value’ 数值1 –》 :value=’1’; 字符串‘1’ –》 value=’1’; 使用prop对象语法 指名接受类型 props:{propA:[Number,String], propB:{type: Number,default: 100}} 自定义事件 在子组件使用 $emit(eventName)||this.$emit(eventName)触发 使用 避免重新渲染 插槽 在子组件中 <slot>无内容时默认显示<slot> 具名插槽 <slot name="header"></slot> 调用<p slot="header">这里可能是一个页面标题</p> Prop 允许外部环境传递数据给组件 事件允许从组件内触发外部环境的副作用 插槽允许外部环境将额外的内容组合在组件中]]></content>
<tags>
<tag>Vue</tag>
</tags>
</entry>
<entry>
<title><![CDATA[使用Java和Mysql完成后台响应]]></title>
<url>%2F2017%2F12%2F09%2FJavaWithMysqlReturnJson%2F</url>
<content type="text"><![CDATA[主要目的: 方便前端完成功能验证主要任务: 使用Java完成后端调用MySQL并返回json格式数据任务准备: 安装好Java tomcat, 主要是设置环境变量使用IDEA搭建一个JavaWeb应用参考 一个完整的搭建过程 主要过程有 新建一个Java –> JavaWeb application 项目 在 WEB-INF 目录下新建 classes 和 lib 目录, 将模块编译输出(path选项)目录指向 classes ,将 Jar 依赖目录指向 lib . JavaWeb已初步建立。接下来配置tomcat。新建一个local tomcat 就好。需要主要端口，Deployment设置。 项目环境搭建完成，开始写程序。 初始化MySQL驱动，方便后面使用 使用Class.forName()加载驱动，得到DriverManager对象 通过驱动以及用户名和密码建立数据库连接，得到Connection对象con 通过stmt = conn.createStatement() 创建查询 执行需要的查询 stmt.executeUpdate(“查询语句”) 遍历得到的结果进行下一把处理。完成后关闭 使用了两个附加包，要自己下载 mysql-connector-java-5.1.45-bin.jar 和 gson-2.6.2.jar。要注意这两个包是放在lib目录中的 123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103import com.google.gson.Gson;import java.io.IOException;import java.io.PrintWriter;import java.sql.*;import java.util.*;import javax.servlet.ServletException;import javax.servlet.annotation.WebServlet;import javax.servlet.http.HttpServlet;import javax.servlet.http.HttpServletRequest;import javax.servlet.http.HttpServletResponse;/** * Servlet implementation class ConnectMySql */@WebServlet("/ConnectMySql") //此处是完成类似路由功能public class ConnectMySql extends HttpServlet { private static final long serialVersionUID = 1L; // JDBC 驱动名及数据库 URL private static final String JDBC_DRIVER = "com.mysql.jdbc.Driver"; private static final String DB_URL = "jdbc:mysql://localhost:3306/mysqldemo?useSSL=true"; // 数据库的用户名与密码，需要根据自己的设置 private static final String USER = "root"; private static final String PASS = "你的密码"; /** * @see HttpServlet#HttpServlet() */ public ConnectMySql() { super(); } /** * @see HttpServlet#doGet(HttpServletRequest request, HttpServletResponse response) */ protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException { Connection conn = null; Statement stmt = null; //获取http query部分参数 转化为MySQL查询参数. //此处为获取GET附带的?后面tb_name="value"&rank="value" String tb_name = request.getParameter("tb_name"); String keyValue = request.getParameter("rank"); // 设置响应内容类型 response.setContentType("application/json;charset=UTF-8"); PrintWriter out = response.getWriter(); try{ // 注册 JDBC 驱动器 JDBC_DRIVER = "com.mysql.jdbc.Driver" Class.forName(JDBC_DRIVER); // 打开一个连接 conn = DriverManager.getConnection(DB_URL,USER,PASS); // 创建Mysql查询 stmt = conn.createStatement(); String sql; // 待执行语句 sql = "SELECT * FROM "+ tb_name+ " WHERE rank"+"="+keyValue+";"; // 执行查询 ResultSet rs = stmt.executeQuery(sql); //数据保存为JSON格式 List<Map<String,String>> list = new ArrayList<Map<String,String>>();//创建Arraylist while(rs.next()) { Map<String,String> jsonMap = new HashMap<String,String>();//要每次创建一个新的映射表，不然只会保存最后一组数据。 jsonMap.put("mLP_Name",rs.getString(2)); jsonMap.put("mLP_Date",rs.getString(3)); jsonMap.put("mLP_LostPlace",rs.getString(4)); list.add(jsonMap);//数据保存在list中 } //用GSON包中的方法序列化json字符串 Gson gson = new Gson(); String jsonstr = gson.toJson(list); //回传json数据 out.println(jsonstr); // 完成后关闭 rs.close(); stmt.close(); conn.close(); } catch(SQLException se) { // 处理 JDBC 错误 se.printStackTrace(); } catch(Exception e) { // 处理 Class.forName 错误 e.printStackTrace(); }finally{ // 最后是用于关闭资源的块 try{ if(stmt!=null) stmt.close(); }catch(SQLException se2){ } try{ if(conn!=null) conn.close(); }catch(SQLException se){ se.printStackTrace(); } } } /** * @see HttpServlet#doPost(HttpServletRequest request, HttpServletResponse response) */ protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException { // TODO Auto-generated method stub doGet(request, response);} 结果 数据库结构 http请求结果 TODO: 使用getAttribute()一次性获取数据，迭代得到查询参数。]]></content>
<tags>
<tag>java Mysql http json ajax</tag>
</tags>
</entry>
<entry>
<title><![CDATA[配置java环境]]></title>
<url>%2F2017%2F12%2F08%2F%E9%85%8D%E7%BD%AEjava%E7%8E%AF%E5%A2%83%2F</url>
<content type="text"><![CDATA[安装Java (JDK JRE) 安装JDK的时候会自动安装JRE, 可选择将JDK, JRE安装在同一目录 配置PATH 与 CLASSPATH 先将JRE, JDK填好, 方便后面使用 JRE_HOME = D:\Program Files\Java\jre-9.0.1; JAVA_HOME = D:\Program Files\Java\jdk-9.0.1; 在path前面加 %JDK%\bin;%JRE%\bin; 设置CLASSPATH = .;%JDK%\lib;%JRE%\lib; 测试. 在 C 盘根目录 测试java是否安装成功, 一般直接java -version即可,此处是运行文件实测. 新建文件命名为 javademo.java ,以下为内容 12345public class javademo { public static void main(String[] args){ System.out.println("Hello World!"); }} 具体分析 如果你直接在C盘根目录 shift+鼠标右键打开命令行窗口,打开后你会发现cmd的当前目录是C:\User\Administrator, 而不是C: 若你接着运行 javac javademo.java —> 找不到文件; 这是因为程序运行时会根据CLASSPATH来查找类, 先查找当前文件夹(即cmd路径), 再查找JDK的lib,最后查找JRE的lib,没发现就会报错. 现在的情况：cmd位置是在C:\User\Administrator,测试文件是在C:,所以出现错误.其他盘正常. javac 可指定运行文件目录 javac C:/javademo.java 在sublime3 运行简单的java程序 在package-> user文件夹中 新建文件名为Java.sublime-build 内容为 { "cmd": ["javac", "$file_name","&&","java", "$file_base_name"], "file_regex": "^(...*?):([0-9]*):?([0-9]*)", "selector": "source.java", "shell": true, "encoding": "GBK" } 新建java文件 ctrl+b即可编译+运行. ctrl+shift+b 选择JavaC 只编译(sublime自带???)]]></content>
<tags>
<tag>java配置</tag>
</tags>
</entry>
</search>