- 博客(34)
- 收藏
- 关注
RSS订阅原创 全局API —— Vue.js的基础学习
1.#Vue.extend(options) 参数：{Object} options 用法：使用基础Vue构造器，创建一个“子类”。参数是一个包含组件选项的对象。data选项是特例，在Vue.extend()中特必须是函数。<div id="mount-point"></div>// 创建构造器var Profile = Vue.extend({ template: '<p>{{firstName}} {{lastName}} aka {{alias}
2020-12-27 15:49:08
365
原创 简单上手ECharts
1.引入ECharts可以直接通过下方进行引用<script src="https://cdn.bootcdn.net/ajax/libs/echarts/5.0.0-rc.1/echarts.common.min.js"></script>2.为ECharts准备一个具有宽高的容器<body> <!-- 为 ECharts 准备一个具备大小（宽高）的 DOM --> <div id="main" style="width:
2020-12-21 15:08:25
183
原创 vue中计算属性（computed）、侦听属性（watch）、方法（method）三者的不同
computed区别于method的区别1.computed是属性调用，而method是函数调用在html的插值内：computed定义的方法是以属性访问的形式调用，methods定义的方法必须加上（）来调用：（如下）<div id="example"> <p>Original message: "{{ message }}"</p> <p>使用计算属性实现: "{{ reversedMessage }}"</p>
2020-12-11 11:10:54
547
原创 git的一些基础操作命令
1.将远程代码克隆到本地在github复制仓库地址下来git clone 仓库地址2.git log 查看全部提交记录git log --author=’'指定查看提交对象git loggit log --author='<userName>'3.上传项目git init 初始化git add . 将所要提交的文件放到暂存区内（git将项目分为三个区：本地，暂存区，远程仓库）git commit - m 第一次提交 将暂存区的代码提交到远程仓库g
2020-12-10 17:43:28
152
原创 vuex中的模块化开发
1.模块化，每个模块拥有自己的state、mutation、action、getterconst moduleA = { state: () => ({ ... }), mutations: { ... }, actions: { ... }, getters: { ... }}const moduleB = { state: () => ({ ... }), mutations: { ... }, actions: { ... }}const stor
2020-12-10 17:34:43
615
1
原创 基础学习vuex
vuex#vuex简介1.状态管理模式new Vue({ // state data () { return { count: 0 } }, // view template: ` <div>{{ count }}</div> `, // actions methods: { increment () { this.count++ } }})这个状态自管理应用包含以下部分
2020-12-10 17:32:27
259
2
原创 Vuex中的表单处理
在严格模式下使用vuex时候，若想要在vuex store的对象是上使用v-model实现双向数据绑定，v-model会试图直接修改store内的值，由于这个修改不是在mutation函数中执行，因此会抛出错误。解决方案1.给中绑定value，然后侦听input或者change事件，在事件回调函数中调用一个方法//输入框的value绑定state内的message属性//侦听input事件，触发updateMessage函数<input :value="message" @input="up
2020-12-10 16:16:58
445
原创 浅谈axios
axios是一个基于promise的HTTP库，可以用在浏览器和node.js中（1）axiosAPI实例化axios.create([config])方法 axios与axios的实例都可调用axios(config) axios.request(config)axios.get(url[, config]) //参数：路径 配置对象 get带参方式带在params上 axios.get("http://47.106.244.1:8099/manager/us
2020-09-25 11:22:11
243
原创 原生ajax、jQuery ajax、axios带参的区别
原生ajaxget头部不设置，参数转为查询字符串拼接到url上post 参数在send() 里（1）发表单格式，设置头部为表单格式，数据也要是表单格式数据（2）发json格式，设置头部为json格式，数据也要是json格式数据样式代码 <script> let qs = Qs; let xhr = new XMLHttpRequest(); // get传参 /*xhr.open( "get",
2020-09-24 19:22:34
211
原创 浅谈hash路由和history路由的区别
hash路由和history路由的区别：1.hash路由在地址栏URL上有#，而history路由没有会好看一点hash路由 121.0.0.1:80/test/index.html#/a/bhistory路由 121.0.0.1:80/a/b2.进行回车刷新操作，hash路由会加载到地址栏对应的页面，而history路由一般就404报错了（刷新是网络请求，没有后端准备时会报错）。3.hash路由支持低版本的浏览器，而history路由是HTML5新增的API。4.hash的特点在于它虽
2020-09-24 19:16:51
2180
原创 Vue-router（Vue的核心插件）
Vue-router（Vue的核心插件）用来提供路由功能。 通过路由的改变乐意动态加载组件，达到开发单页面程序的目的（1）基本应用：在vue中进行路由祖册，在模板中通过router-view来接收路由组件1.提供组件给路由使用2.注册组件3.定义路由对象数组 let routes = [ // 一个路由对象 { // 路由路径 path: "/a", // 对应的组件 component: my
2020-09-22 20:13:55
578
原创 浅谈Vue-插槽
插槽（插槽允许我们在调用组件的时候为子组件传递模板）默认插槽没有名字的插槽（或者name为default的插槽）当组件渲染的时候，内的内容会被父组件内的内容填充（在这里被填充为Hello和World） 插槽内可以包含任何模板代码，甚至是其他组件 slot标签内部的内容为默认值，也就是当调用组件的时候没有设置插槽内容，则插槽内容默认为内的内容 <body> <div id="app"><my-com>Hello</my-com> <my
2020-09-21 19:06:37
792
原创 Vue-计算属性computed
计算属性：computed我们希望一个变量是经过某种计算后输出而不是直接输出的时候可以使用到计算属性1.在Vue定义中直接使用表达式获取结果 <body> <div id="app">{{msg}} <br> a:<input type="text" v-model.number='a'></input> &l
2020-09-20 15:29:39
137
原创 Vue-表单输入绑定
表单输入绑定用v-model指令在表单,及元素上创建双向数据绑定。 他会根据表单控件类型自动选取正确的方法来更新元素。 v-model会忽略所有表单元素的value、checked、selected、attribute的初始值，总是将vue实例的数据作为数据来源。 通过JavaScript在组件的data声名初始变量1.单行文本框 <div id='app'> <!-- v-model="stu.username"绑定在stu对象的username属性上 --
2020-09-20 14:37:30
199
原创 Vue-事件修饰符
Vue-事件修饰符事件处理函数只有纯粹的数据逻辑，而不去处理DOM事件细节，通过事件修饰符来完成这些细节 <form v-on:submit.prevent="onSubmit"></form> //可以简写成 <form :submit.prevent="onSubmit"></form>常见的事件修饰符.stop停止事件冒泡行为 <div class="inner" @click.stop="inner">inner
2020-09-17 11:29:48
192
原创 Vue模板语法
1.插值1.1文本 <span>Message: {{ msg }}</span><div id="app"> {{msg}} </div> <script> new Vue({ // 绑定div el: "#app", data: { msg: "hello", }, }) 1.2原始html
2020-09-16 20:13:45
250
1
原创 Vue生命周期相关知识
第一阶段 vue实例的初始化阶段beforeCreate() 在初始化的时候调用了beforeCreate，完成了vue实例的声名周期相关属性的初始化以及事件的初始化 ！！在这个阶段还不能直接访问data中的属性&method中的方法craete() 在舒适化王成后，完成了vue的数据注入与数据监听操作 ！！可以对数据进行访问第二阶段 挂载并渲染beforeMount() 在created之后，vue会判断梳
2020-09-16 19:21:07
125
原创 如何将项目部署到云服务器
1.将jar包上传到阿里云服务器指定目录下比如/jar 下（将jar包托放进小黄鸭（Cyberduck）的jar目录下）2创建数据库2.1用本地的Navicat连上阿里云的数据库（双击点亮）2.2右键新建数据库，根据项目所需创建对应数据库名的数据库2.3双击点亮数据库，右键选择运行SQL文件，执行2.4给指定用户授权数据库访问权限，点击左上角的用户（这里给briup用户授权），双击briup用户，点击权限，选择添加权限，选择所需要授予权限的数据库，全部授予权限。3启动jar3.1打
2020-09-15 19:57:37
1066
原创 github的远程仓库与本地文件的一些基本操作
克隆码云的远程仓库到本地1.在网页创建了一个远程仓库点击网页右上角的+，创建新的本地仓库2.复制仓库地址3.在桌面新建一个Git仓库文件夹，并在终端打开（将地址栏删除输入cmd即可）4.在终端输入命令 git clone 仓库地址5.在桌面的Git仓库文件夹即可发现克隆完成的远程仓库文件夹更新本地代码，将远程仓库代码更新到本地1.将远程仓库文件夹在终端打开2.输入命令git pull origin master3. git add *git commit -m ‘提交代码的说明’
2020-09-13 11:44:57
262
原创 Symbol
SymbolSymbol,一种原始的数据类型，表示独一无二的值。 Symbol函数可以接受参数，表示对于这个唯一值的描述。let s = Symbol()typeof s; // 'Symbol' 变量s表示独一无二的数值Symbol的应用由于每一个symbol值都是不相等，这意味着symbol值可以做为标识符，用于对象的属性名。 就能保证不会出现同名的属性，可以防止某一个键不小心改写或者覆盖。 let s = Symbol(); var obj = {};
2020-09-10 19:45:19
160
原创 Es6 Class(类)&类的继承
Es6 Class(类)&类的继承JavaScript语言中，生成实例对象的传统方法是通过构造函数。ES6引入了Class(类)这个概念，通过class关键字，可以定义类构造函数constructor方法是类的默认方法，通过new命令生成对象实例时，自动调用该方法。 一个类中必须有constructor方法 class Person{ constructor(){} }实例方法&实例属性定义在类体中的方法是实例方法 定义在类体中的属性是实例属性
2020-09-10 19:08:11
266
原创 map
MapMap类似于对象，也是键值对的集合， 但是“键”的范围不限于字符串，各种类型的值（包括 对象）都可以当作键。 Object 结构提供了“字符串—值”的对应，Map结构提供了“值— 值”的对应 Map 可以接受一个数组作为参数。该数组的成员是一个个表示键值对的数组。 var map = new Map([ [‘name’, ‘张三’], [‘title’, ‘Author’] ]);Map APIMap.prototype.size 返回 Map 结构的成员总数。Map.prototype.se
2020-09-09 20:22:52
96
原创 Set
Setset：成员的值唯一，没有重复值Set 构造函数可以接受一个数组（或者具有 iterable 接口的其他数据结构）作为 参数，用来初始化。初始化set var set = new Set();Set 中的特殊值Set 对象存储的值总是唯一的，所以需要判断两个值是否恒等。有几个特殊值需要特殊对待： +0 与 -0 在存储判断唯一性的时候是恒等的，所以不重复； undefined 与 undefined 是恒等的，所以不重复； NaN 与 NaN 是不恒等的，但是在 Set 中只能存一个，不重复
2020-09-09 20:11:50
99
原创 ES6数组API
ES6数组API1.Array.from() ：将类数组对象或可迭代对象转化为数组。 // 参数为数组,返回与原数组一样的数组 console.log(Array.from([1, 2])); // [1, 2] // 参数含空位 console.log(Array.from([1, , 3])); // [1, undefined, 3]2.Array.of():将参数中所有值作为元素形成数组。// 参数值可为不同类型console.log(Array.of(1, '2
2020-09-09 19:45:58
341
1
原创 ES6-＞ES5的转换&模块化
ES6->ES5的转换*1.下载依赖** cnpm install --save-dev babel-cli babel-preset-latest2.在项目根目录下创建.babelrc { "presets":["latest"] }3.开始转换 转码结果输出到标准输出 babel a.js 转码结果写入一个文件，--out-file 或 -o 参数指定输出文件 babel a.js --out-file
2020-09-09 19:15:49
496
原创 HTML5API 通信
HTML5API 通信1.跨文档消息传输1）在A页面中通过window.open方法打开B页面2）在A页面中通过iframe嵌套B页面 A页面的核心代码 window.onmessage= function(event){ event.data //数据 event.origin //源 } B页面的核心代码 win.postMessage(message（消息）,targetOrigin（目
2020-09-08 19:34:52
172
原创 文档对象模型DOM
文档对象模型DOM文档对象模型DOM简介DOM是针对HTML和 XML文档的一个APINode类型简介DOM1级定义为一个NOde接口，该接口将由DOM中所有节点类型实现JavaScript中所有的节点类型都继承自Node类型，所有的节点类型的共享着相同的基本属性和访问节点关系属性：nodeType表示节点类型Document–> 9document 是Document构造函数的实例Element -->1;document.bo
2020-08-27 20:09:01
277
原创 JavaScript实现九九乘法表的四种方式
第一种实现形式function test1() {for (var i = 1; i < 10; i++) {//console.log(i);//做第三行的数据var str = “”;for (var j = 1; j <= i; j++) {//1 2 3str += j + “*” + i + “=” + i * j + “\t”;}console.log(str);}}test1();第二种实现形式function test2() {for (var.
2020-08-21 11:16:36
1729
原创 JavaScript--对象
对象对象的定义无序属性的集合其属性可以包含基本值，对象，或者函数可以将对象想象成散列表:键值对，其中值可以是数据或者函数。ECMAScript中的对象 其实就是一组数据(属性)和功能(方法)的集合。创建Object实例使用构造函数创建，new Object()var person = new Object(); person.name = “briup”; person.age = 22; X使用对象字面量表示法 不同的属性之间用’,‘分割，属性名和属性
2020-08-20 20:04:07
133
原创 JavaScript简介
JavaScript简介JavaScript是一种编程语言JavaScript的组成部分核心ECMAScript应用程序编程接口APIDOM(Document Object Model)BOM(Browser Object Model)其他第三方APIJavaScript的特点客户端代码，在客户机上执行JavaScript特殊的地方在于它也可以作为服务器端代码执行，但是需要搭建Node环 境。在浏览器上执行解释性语言被内置于浏览器或者NodeJS平
2020-08-17 20:05:07
74
原创 css的常用五大布局
布局默认文档流对页面不加以任何装饰，元素自动的布局方式元素在页面中的显示顺序与元素在代码中出现的顺序是一致的块级元素独占一行空间，宽度默认为父级的100%，高度由其内容高度所决定。行内元素与其他元素共享一行空间，宽高由其内容所决定。使用如下属性改变默认文档流display通过为display属性指定值block, inline ,inline-block等可以改变元素在正常流 中的行为float通过为float属性指定值left、right使得块级元素在一行中排列
2020-08-16 14:00:07
398
原创 css的animation（动画）、transition（过渡）、transform（变形）
animation、transition、transformAnimation（动画）使用keyframes定义如何随着时间的移动改变CSS属性值可以通过制定他们的持续时间，重复次数，如何重复来控制关键帧的行为由两部分组成css动画配置animation-name动画名字可以与@keyframes中定义的动画名字绑定animation-duration动画持续时间动画完成一个循环所需要的时间长度animation-iteration-count动画重复次
2020-08-16 13:58:27
517
原创 html5新增
html5新增新增的表单元素progress 进度条max 定义进度元素所要求的任务的工作量 默认为1value 定义已经完成的工作量（如果max为1，则该值必须介于0-1）output 用户动作产生的结果meter 表示规定范围内的数量值value在元素中特地表示出来的实际值，该值在min与max之间，如果未指定 ，该值默认为1min指定规定范围时允许使用的最小值，默认为0max指定规定范围时允许使用的最大值，默认为1low
2020-08-09 22:04:10
115
原创 # HTML5（表单）
web大前端HTML5（表单）表单表单数据的内容类型application/x-www-form-urlencoded(默认)multipart/form-datatext/plainForm标签的可用属性action 用于处理表单信息的应用程序地址method 浏览器用于提交表单的http方式get：表单数据被附加在URL上，用？隔开post：表单数据包含在http协议的请求报文中name 设置表单的名字target 浏览器接收form的提交信息
2020-08-09 22:01:41
66
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人