- 博客(406)
- 收藏
- 关注
RSS订阅原创 华为机考-求员工薪资中位数
现有salary表(员工ID，部门，薪水 )，请输出每个部门薪水中位数及对应的员工ID，输出字段员工ID，部门，中位数薪水。如果一个部门有偶数个员工，则输出中间两个员工ID和薪水。如果有两个员工薪水相同都可作为中位数，则随机取一位，不得两个都输出。请根据员工ID进行排序。(不得直接通过指定特定id得到预期结果)。
2022-11-25 00:00:00
359
1
原创 02.关于Echarts 布局所涉及的css
1.Thymeleaf模板引擎 2.less 3.innerHTML 与 innerText区别：前者识别标签，当然也会获取到标签，后者不会识别标签只会识别标签中的内容，因而识别时没有标签； 4.section 标签定义文档中的节（section、区段）。比如章节、页眉、页脚或文档中的其他部分； 5.px 与 rem 的选择？ a.对于只需要适配少部分手机设备，且分辨率对页面影响不大的，使用px即可； b.对于需要适配各种移动设备，使用...
2021-09-07 18:27:08
653
原创 01.Enchart初步入门
数据可视化：1.数据可视化主要目的：借助于图形化手段，清晰地有效的传达与沟通信息； 2.数据可视化可以把数据从冰冷的数字转换成图形，揭示蕴含在数据中的规律和道理；数据可视化 Echatrs 使用 1.可视化面板布局适配屏幕 2.利用ECharts 实现柱状图展示本次学习技术栈 1.基于flexible.js + rem 智能大屏幕配置 2.Vscode cssrem 插件：px->rem自动转换的插件 3.flex布局 ...
2021-09-07 18:23:36
791
原创 GIt相关问题排查
问题1：error: The following untracked wonking tree files would be overwritten by merge:解决办法：git clean -d -fx
2021-08-31 14:33:29
154
原创 31.Slot作用域插槽
组件作用域1.就是父组件与子组件各在data中定义一个相同的字段flag； 2.在VM数据时，只会访问各自的data，这就是作用域；作用域插槽 两句话概括： 1.父组件替换插槽的标签，但是内容由子组件来提供； 2.插槽不仅可以让标签作为共同性，也可以让数据作为共同性传递出去；用需求来进一步指明slot作用域插槽 1.子组件中包括一组数据，比如：planguage:['js',’python‘,'c++','java'] 2....
2021-08-19 19:57:27
374
原创 30.Slot插槽
在生活中，插槽目的是为了让我们原来的设备具备更多的扩展性；组件的插槽道： 组件的插槽也是为了让我们封装的组件更加具有扩展性。 让使用者可以决定组件内部的一些内容到底展示什么。...
2021-08-19 18:59:43
125
原创 29.子访问父【＄parent、＄root】
$parent<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Title</title></head><body><div id="app"> <childrencpn></childrencpn></div><templ.
2021-08-18 18:49:02
116
原创 28.父访问子【＄children、＄refs】
有时候需要父组件直接访问子组件，子组件直接访问父组件，或者是子组件访问根组件： 1.父组件访问子组件：使用 $children 或者 $refs (reference:引用)； 2.子组件访问父组件：使用 $parent使用 $children 访问子组件 1.this.$children是一个数组类型，它包括所有子组件对象； 2.我们这里通过一个遍历，取出所有子组件的message状态；<!DOCTYPE ...
2021-08-18 16:28:18
156
原创 27.本地初始化项目
环境配置d:vue init webpack 自定以一个项目名// 环境配置初始化后，启动本地初始化项目D:\>cd qazwsxD:\qazwsx>npm run dev配置新页面如果引入了某项技术后，需要引入less配置路径...
2021-08-16 15:53:44
105
原创 26.vue组件通信（结合双向绑定案例）
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>组件通信</title></head><body><div id="app"> <children-cpn :number1="num1" :number2="num2" .
2021-08-08 20:26:11
110
原创 25.vue知识回顾
一、计算属性1.1 计算属性fullName: set() get()1.2 计算属性和methods对比计算属性在多次使用时，只会调用一次 它是由缓存的二、事件监听 2.1 事件监听的基本使用 2.2 参数问题 btnClick() btnClick(even) btnClick(abc,event) -> $event 2.3 修饰符 .s...
2021-08-07 20:55:18
87
原创 疑惑：vue 为什么只能有一个根元素
今天在学习vue时注意到一个问题：如下如所示有没有这个div标签，导致的不一致结果，第二行元素渲染不出来并且控制台报错经过思考发现是vue.2的问题：只能渲染一个根元素，至于原因，要从源码开始分析了vue2源码分析是因为query Selector选择器的第一个元素，以第一个元素为根标签切入口，开始渲染整个模版。 详见原因：https://www.cnblogs.com/shababy/p/13517396.html...
2021-08-05 16:15:02
815
原创 24.父子组件之间的通信
在开发中，往往一些数据确实需要从上层传递到下层：比如在一个页面中，我们从服务器请求到了很多的数据； 其中一部分数据，病得使我们整个页面的大组件来展示的，而是需要下面的子组件 整个时候，并不会在让子组件再次发送一个网络请求，而是直接让大组件（父组件）将 数据传递给小组件（子组件）。如何进行父子组件间的通信呢？Vue官方提到两种方法：通过props向子组件传递数据 通过事件向父组件发送消息在下面的代码中，我直接将Vue实例当做父组件，并且其中包含子组件来简化代码。...
2021-08-05 15:29:09
159
原创 23.组件模板变量分析又组件data为何必须是函数？
组件内部是不可以直接访问 vue 的实例中的data,可以即使可以间接访问，如果将所有的数据都放在 Vue 实例中，Vue 实例就会变得非常臃肿。问题：组件怎么访问自己变量？vue组件应该有自己保存数据的地方 ，组件对象也有一个data属性； 也可以由methods等属性，下面我们有用到； 只是这个data属性必输是一个函数 ，而且这个函数返回一个对象，对象内部保存着数据；代码如下：<!DOCTYPE html><html lang="en">...
2021-07-19 18:48:25
95
原创 22.父子组件【extend】、组件语法糖、组件模板分离
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Title</title></head><body><div id="vue"> <cpn2></cpn2></div><script src="../js/vue.js"></sc.
2021-07-19 15:29:01
154
原创 21.什么是vue组件？【全局组件/局部组件】
注册组件的基本步骤：创建组件构造器 注册组件 使用组件和直接使用一个div看起来没有什么区别 当很多地方都需要使用这样的信息，我们可以把这个封装成我们需要的组件使用组件化的基本使用过程53集...
2021-07-19 10:19:16
117
原创 20. v-model 的修饰符使用【lazy、number、trim】
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Title</title></head><body> <div id ="vue"> <!--1.修饰符：lazy--> <!--作用输入时，不会随时更改model的值，当失去焦点事件时才会触发更改事件--> &l.
2021-07-17 13:27:54
323
原创 19.VUE【radio、checkbox、select】
v-model radio<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Title</title></head><body><div id ="vue"> <!--相同name才会导致互斥事件，只能选其1--> <!--但是相同v-model-->.
2021-07-16 19:40:07
120
原创 18.双向绑定 v-model
v-model其实就是一个语法糖，它的背后本质上是包含两个操作：1.v-bind 绑定一个value属性 2.v-on 指令给当前元素绑定input事件代码如下：<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Title</title></head><body><div id="vue"
2021-07-16 18:09:01
70
原创 17.书籍购物车案例（过滤器、reduce函数）
html<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Title</title> <link rel="stylesheet" href="style.css"></head><body><div id="vue"> <div v-if="books.len.
2021-07-16 17:17:43
167
原创 16.JavaScript filter、map、reduce高级函数
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Title</title></head><body><script src="../js/vue.js"></script><script> const nums = [10, 20, 30, 40, 500].
2021-07-16 16:20:44
78
原创 15.v-for绑定key、数组响应式方法
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Title</title></head><body><div id="vue"> <ul> <!-- v-on:key="key"【对于数组 splice 的性能优化】 1.不加上这个key的绑定，那.
2021-07-14 19:12:35
291
原创 14. v-for 遍历对象
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Title</title></head><body><div id="vue"> <!--1.在遍历对象的过程中，如果只是获取一个值，那么获取到的是value--> <ul> <li v-for="i.
2021-07-14 16:07:51
75
原创 13.v-show 与 v-if 的区别
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Title</title></head><body><div id ="vue"> <!-- 区别： v-if ：当条件为false,包含 v-if 指令的元素，根本就不会存在dom中 v-show : 当条件为fasle时.
2021-07-14 14:56:55
105
原创 12.登录切换的小案例
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Title</title></head><body><!--需求设计： 1.用户登陆时，可以切换使用用户账户登陆还是邮箱地址登陆--><div id="vue"> <span v-if="isUser">.
2021-07-14 14:27:19
107
原创 11. vue if 条件判断
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Title</title></head><body><div id="vue"> <h2 v-if="isShow"> <div>我是if</div> </h2> <h2 .
2021-07-14 13:07:18
7631
原创 10.v-on 的修饰符
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Title</title></head><body><div id ="vue"> <!--.stop修饰符的使用--> <!--如果不加这个修饰符，那么先执行完 btnClick 事件后，会再执行 divClick 事.
2021-07-14 11:49:54
86
原创 09.v-on参数传入
如果该方法不要恩外参数，那么方法后的()可以不参加。 但是注意：如果方法本身中有一个参数，那么会默认将原生事件event 参数传递进去 如果需要同事传入某个参数，同时需要event时，可以通过$event 传入事件<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Title</title></head><bod
2021-07-14 11:01:33
78
原创 09.webStorm 创建适时模板
按Ctrl+Alt+S打开 IDE 设置并选择编辑器 |实时模板。 选择要在其中创建新实时模板的模板组（例如，other）。 如果不选择模板组，实时模板将被添加到用户组中。 单击并选择实时模板。 在缩写字段中，指定将用于扩展模板的字符。例如：todo。您还可以定义语言以应用新添加的模板。 （可选）在“描述”字段中，描述模板以供将来参考。 例如：Insert TODO comment with the current date, user, and tw...
2021-07-14 10:31:15
280
原创 08. vue - var let const
<!DOCTYPE html><html lang="en"> <head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document<..
2021-07-14 09:00:44
59
原创 07.计算属性 getter 与 setter 方法
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Title</title></head><body><div id="app"> <h2>姓名：{{fullname}}</h2></div><!-- 引入vue.js 文件-->&l.
2021-07-13 18:19:33
87
原创 06.computed 与 methods 的区别（以数组为例）
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Title</title></head><body><div id="app"> <h2>总价格：{{totalPrice}}</h2></div><!-- 引入vue.js 文件-->.
2021-07-13 17:54:01
90
原创 05.点击数组获取元素值、点击数组元素标红该元素
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Title</title></head><body><!-- $event 是指当前触发的是什么事件（鼠标事件，键盘事件） $event.target 则指的是事件触发的目标，即哪一个元素触发了事件，这就直接获取该dom元素-->&.
2021-07-13 15:30:24
246
原创 04.v-bind 绑定style属性
v-bind 绑定style属性代码如下：<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Title</title></head><body><div id="app"> <!-- v-bind 动态绑定style 属性 &l.
2021-07-13 11:31:49
106
原创 03.Vue api [v-bind]
动态绑定属性 1.之前都是通过mustance语法绑定数值到内容当中，但是有时候很多情况我们都需要绑定到属性中； 2.例如 <img src="imgUrl" alt=""/>，此时就需要 v-model 标签了，还有href标签等。基础版<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>...
2021-07-12 19:45:26
165
原创 02.Vue api [v-for、v-on、mustache语法、v-once、v-html、v-text、v-pre、 v-cloak]
v-for<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Title</title></head><body><div id ="vue"> <ul> <li v-for=" Item in movie">{{Item}}</li> .
2021-07-12 12:38:54
115
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人