- 博客(26)
- 收藏
- 关注
RSS订阅
原创 初识webpack：webpack配置组成
module.exports = { entry:'./src/index.js', //打包的入口文件，4.0以后默认就有 output:'./dist/main.js', //打包的输出，4.0以后默认就有 mode:'production', //环境 module:{ rules:[ //Loader配置 {test:/\.txt$/,use:'raw-loader'} ] }, plugins:[ //插件配置 new HtmlwebpackPl
2021-10-14 06:25:35
96
原创 1.为什么需要构建工具
1.转换ES6以上的语法2.转换JSX（前端三大框架）3.CSS前缀补全/预处理器（less、sass）4.压缩混淆5.图片压缩
2021-10-14 06:07:22
124
原创 解决重装系统后打开office跳转到网页的问题
解决重装系统后打开office跳转到网页的问题问题描述解决方案1.打开"Office",点击-->安装Office2.此时会跳转到网页，点击-->返回到订阅3.点击-->安装4.选择相应版本，点击-->安装5.安装完成之后，打开文件，正常安装即可结语问题描述本人最近刚重装了系统，发现office突然打不开了，点击office会跳转到网页（如下图）。这个问题本人已解决，特分享给小伙伴们。????解决方案1.打开"Office",点击–>安装Office2.此时会跳转
2021-10-13 21:23:56
35742
15
原创 项目部署心得
项目部署心得一、进入阿贝云二、使用阿贝云面板1.软件商店中下载项目所需的工具2.文件中放行端口号30003.为MongoDB创建用户名和密码4.部署Express项目5.使用Robo 3T远程连接MongoDB数据库三、问题汇总一、进入阿贝云这是阿贝云的官网：阿贝云官网二、使用阿贝云面板如下是阿贝云首页1.软件商店中下载项目所需的工具我的项目是Node+MongoDB+Express，所以只需下载两个软件：PM2管理器（部署Node环境所需）MongoDB2.文件中放行端口号3000
2021-03-09 09:37:58
202
原创 HTML5日常总结
总结：给当前元素的font-size设置2em表示是父元素font-size的2倍。给当前元素的width、margin等等设置2em表示是当前元素font-size的2倍。p标签内不能嵌套块级元素。
2020-12-04 15:55:19
65
原创 Vue学习第五天：20选择何种模式的路由及底层原理
总结：Hash模式无法使用锚点定位（默认）。History模式需要后端配合，IE9不兼容（可使用强制刷新处理）。History模式浏览器路径没有#，并且可以使用锚点定位。通过Vue.util.defineReactive这个API将_route设置为响应式的。router-link、$router.push等等都会触发updateRoute，updateRoute会去改变_route，router-view根据不同的链接渲染不同的组件。...
2020-11-07 15:19:13
77
原创 Vue学习第五天：19Vue Router的使用场景
总结：路由其实说的就是路径。中后台都在使用vue-router。之前每访问一个路径都要刷新页面，很影响用户体验。单页面（SPA）开发模式，只需要访问一个页面就可以跳转不同的路径。监听URL的变化，并在变化前后执行相应的逻辑。不同的URL对应不同的组件。提供多种方式改变URL的API（URL的改变并不能导致页面的更新）。...
2020-11-07 15:00:51
201
原创 Vue学习第五天：18Vuex最佳实践
使用常量替代mutation事件类型。（有利于团队协作，常量语法高亮）Module（1）开启命名空间namespaced:true。（2）嵌套模块不要过深，尽量扁平化。（3）灵活应用createdNamespacedHelpers。（辅助函数）（4）import store from ‘./store’ 会自动引入store文件夹下的index.js。（5）将modules写成了module，半天找不到原因????。（6）actions中写ajax请求和业务逻辑。（每一个逻辑都是一个
2020-11-07 12:58:52
130
原创 Vue学习第四天：17Vuex核心概念及底层原理
min-vuex.js文件import Vue from 'vue'//默认参数function Store(option = {}) { //解构赋值 var { state = {}, mutations = {} } = option; //通过Vue将state设置为响应式数据 this._vm = new Vue({ data() { return { $$sta
2020-11-05 19:57:45
217
1
原创 Vue学习第四天：16如何在Vue中使用Vuex
main.js文件import Vue from 'vue'import Vuex from 'vuex'import App from './App.vue'Vue.use(Vuex)Vue.config.productionTip = falseconst store = new Vuex.Store({ state: { count: 0 }, mutations: { addCount2(state, n) {
2020-11-05 17:42:34
82
原创 Vue学习第四天：15为什么需要Vuex
总结：小型项目的状态管理可以使用provide和inject，但它们只能提供响应式数据。大型项目就需要系统的一个状态管理，并且对这个状态管理的要求不仅仅只是提供一个响应式数据就可以了，因此，学习使用vuex是很有必要的。...
2020-11-05 16:41:50
249
1
原创 Vue学习第四天：12常用高级特性provide和inject
跨组件通信总结：开发通用组件频率用的相当高。F组件若想和I组件进行通信，普通方式下需要通过$emit事件往父组件进行层层传递，A组件再通过属性往子组件进行层层传递，这种方式是很脆弱的，基于此，有了provide和inject。provide提供数据，inject注入数据。通过provide和inject，E组件通过层层冒泡的形式从A组件中取数据。E组件和F组件都从A组件取相同的数据，可以通过from的方式给数据起别名。provide直接提供this，this中的数据都是响应式的。若C组件
2020-11-05 09:02:46
289
原创 Vue学习第三天：11指令的本质是什么
总结：不建议使用v-html指令，有风险。使用v-pre指令的元素，该元素文本节点内的{{message}}不会被浏览器编译，原样输出{{message}}。使用v-once指令的元素，该元素文本节点内的{{message}}只会被浏览器编译一次，后续不会再改变。这个有利于性能优化，主要应用于论坛文章之类的静态页面。v-cloak指令只能在HTML文件中使用。（很少用）指令的本质其实就是js的语法糖，指令从template编译到render函数时，会把这些语法糖编译成js代码。通过自定义指令可
2020-11-04 20:40:02
251
原创 Vue学习第三天：10生命周期的应用场景和函数式组件
总结：钩子函数指的是Vue实例的创建、挂载、更新和销毁过程。创建、挂载和销毁过程只会执行一次，而更新过程会执行多次。mounted阶段主要进行异步请求、操作DOM、定时器等操作。beforeDestroy阶段主要进行定时器销毁等操作。函数式组件可以认为是一个简单的方法。借助函数式组件可以去做临时变量。遗留问题：函数式组件还是不太懂。...
2020-11-04 19:59:31
105
原创 Vue学习第三天：09合理应用计算属性和侦听器
<template> <div> 计算属性：{{fullName2}}<br /> <label>firstName：<input v-model="firstName"></label><br /> <label>lastName：<input v-model="lastName"></label><br />
2020-11-04 16:46:17
105
原创 Vue学习第二天：08如何触发组件的更新
Vue的响应式更新总结：绝对不要直接更改DOM。状态（data）是组件自身的数据。属性（props）是来自父组件的数据。
2020-11-03 19:06:52
329
原创 Vue学习第二天：07理解虚拟DOM及key属性的作用
总结：jQuery是通过事件直接操作DOM的，由于项目越来越大，事件和DOM的耦合度越来越大，项目维护和扩展不便，基于此，才诞生了Vue和React。Vue和React都是引入了一个数据中间层（State），通过事件操作数据，Vue底层将数据映射到DOM上，避免了事件直接操作DOM。Vue中数据的变化会影响DOM的更新，而DOM的更新是非常耗性能的，影响用户体验。数据的变化如何减少DOM的更新？基于此，有了虚拟DOM的概念。数据不会直接映射到DOM上，而是通过data+template形成一个DO
2020-11-03 18:07:39
175
原创 Vue学习第二天：06双向绑定和单向数据流不冲突
<template> <div :class="name"> {{message}}<br /> <label>测试1：<input v-model="message" /></label><br /> <label>测试2：<input :value="message" @input="currentFun" /></label>
2020-11-03 16:54:41
187
原创 Vue学习第二天：05理解单文件组件
App.vue<template> <ly-product-list class="ly-u-ul"> <!-- 不写 v-slot默认就是默认插槽 --> <template v-slot> <ly-product v-for="(item,index) in productList" :key="index" :name="item.name" :specification="item
2020-11-03 16:13:55
109
原创 Vue学习第二天：04Vue组件的核心概念“插槽”
总结：插槽实际是一种父组件往子组件传递复杂数据的一种方式（比如传递组件或者元素）。当只需要传递一个组件或元素时，使用默认插槽即可。当需要传递多个组件或元素时，就需要使用具名插槽。...
2020-11-03 14:56:57
98
原创 Vue学习第一天：03Vue组件的核心概念“事件”
<body> <div id="app"> <ly-product-list class="ly-u-ul"></ly-product-list> </div> <script src="./vue.js"></script> <script type="text/javascript"> Vue.component('ly-product', {
2020-11-02 19:28:21
118
原创 Vue学习第一天：02组件基础及组件注册
<body> <div id="app"> <ly-product-list class="ly-u-ul"></ly-product-list> </div> <script src="./vue.js"></script> <script type="text/javascript"> Vue.component('ly-product', {
2020-11-02 18:17:02
134
2
原创 Vue学习第一天：01插值和指令
<!DOCTYPE html><html> <head> <meta charset="utf-8"> <title>第一个Vue程序</title> </head> <body> <div id="app"> <ul> <li v-for="(item,
2020-11-02 17:28:03
756
原创 JavaScript中的事件委托（事件代理）
说到事件委托，其实它主要是为了达到优化代码、提高性能的一种基于事件冒泡的方式。（至于事件冒泡，大家可以翻我博客，对事件捕获和事件冒泡都做了详细的介绍。）大家先来看这样的一个例子：项目经理有一个需求，需要指出⽤⼾在表格中单击的是哪⼀个单元格，可以将所有的单元格背景⾊设置为⽩⾊，当单击单元格时，将被单击的单元格设置为⻩⾊。按照正常的逻辑思维，我们都是在每个单元格上添加单击事件处理函数。例子如下：const cells = document.querySelectorAll('td');for (let
2020-10-30 10:52:41
120
原创 JavaScript中实现变量的私有化并记录日志
代码如下（示例）：<script> function Ninja() { //私有变量_name let _name = "zhangsan"; Object.defineProperty(this, "name", { get() { return _name; }, set(value) { _name =
2020-10-29 10:52:01
90
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人