- 博客(16)
- 收藏
- 关注
RSS订阅原创 el-tooltip判断文本溢出时才隐藏
html代码<el-tooltip content="哈哈哈" placement="top" :disabled="!isShowTooltip"> <span class="nameStyle" @mouseenter="visibilityChange($event)" >哈哈哈哈哈哈哈哈</span> </el-tooltip>js 代码 //文字溢出隐藏 visibilityChange(
2022-04-19 15:35:35
423
原创 弹性布局-
弹性布局父元素属性/* flex-direction: ;设置主轴方向 row :默认值从左到右 row-reverse 从右到左 column 从上到下 column-reverse 从下到上 justify-content: ; 设置主轴上的子元素排列方式 flex-start 默认值从头部开始 如果主轴是x轴,侧从左到右
2021-11-01 19:57:52
81
原创 简单讲解 js 中this指向问题
简单讲解 js 中this指向问题如何判断this 倒是是哪一个对象?看 this 在哪?1:全局 this===window2:function函数 “谁触发执向谁?”2.1 函数触发是不是 call apply bind如何是,this===参数2.2 看是不是new 触发的 是 this === new 实例的对象注意:看一下函数return 是否为 [数组 对象 函数],如果是 那么 this 为 retrun 值2.3
2021-09-10 19:41:34
55
原创 vue 组件传值
vue组件间传值1.父子组件给儿子组件传值1.父亲组件传值给儿子组件 通过props属性进行传递。（子组件中设置props:[“count”]，然后父亲在调用子组件的标签中添加count:“data的变量”）代码如下//儿子组件 Children.vue<script>import Grandson from './Grandson'export default { props:['count']}</script>父亲组件<Children :
2021-08-10 22:28:24
144
原创 Vue 生命周期
<!doctype html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0"> <meta http-
2021-08-10 20:55:03
256
原创 webpack5 搭建svg环境
webpack5搭建svg环境svg 是矢量图。使用svg画的图片，不会怎么放大，都不失真1: svg 可以通过 img标签加载2: svg 可以作为字体图标3: svg 可以用在大屏可视化上 做各种标记点。进阶：将svg 做成 icon 组件，并使用webpack 搭建环境 … 编辑中…开发实例代码如下// user.svg<svg verison="1.1" xmlns="http://www.w3.org/2000/svg" width="24" height="24"
2021-07-22 23:14:54
609
原创 webpack 搭建ts环境
webpack 搭建ts环境ts 需要在typesctipt 运行ts 运行过程: ts_–>编译为js文件—>运行js1: 安装依赖typescript 是ts的运行环境,将ts编译为 js文件awesome-typescript-loader 是webpack 将 ts 语法 变为 jshtml-webpack-pluginwebpackwebpack-cli2: 创建webpack.config.js文件初始化文
2021-07-22 23:14:15
182
原创 webpack搭建scss环境
webpack搭建scss环境1 scss 运行环境node-sassscss 文件需要在node平台运行,node-sass sass 是 scss sass的运行平台2 安装依赖node-sasssass-loader 加载 Sass/SCSS 文件并将他们编译为 CScss-loader 解析模块要的 css @import …mini-css-extract-plugin
2021-07-22 23:13:37
401
原创 webpack 搭建 less 环境
webpack 搭建 less 环境1安装依赖less less 的运行环境less-loader 将less编译为 css 的loadercss-loader 让js解析css代码 mport/require()style-loader 把css插入到dom中mini-css-extract-plugin 将css离去单独的文件ht
2021-07-22 23:12:53
223
原创 webpack5 实现devserve自动化打包
webpack-dev-server需求1: 通过一个 命令 运行打包后代码。代替手动运行2: 开发者编写的代码更新时，自动打包。并且自动运行安装webpack-dev-server配置 devServermodule.exports = { devServer: { contentBase: path.join(__dirname, 'dist'), compress: true, port: 9000, ope
2021-07-22 23:10:47
194
原创 初始webpack
1为什么会webpack1 因为开发者编写的代码是模块化开发，.less .scss .vue .js等文件2 开发者编写的代码是工程化因为浏览器不能解析vue react less scss 等工程化模块化的代码，所以需要webpack 工具，将编写的模块化代码，进行编译/打包,然后在浏览器中运行的编译后或者打包后的代码编译：由A变B 就是编译打包：将代码放到一个文件中，这些代码可能被重新压缩了2webpack是什么？webpack 是自动化构建工具3：怎么搭建使用webpack的
2021-07-22 23:05:21
73
原创 es6新特性
es6新特性let const 与 var 的区别1: var 声明的变量有变量提升 let const 没有2：let 声明为变量 const 为常量3：const 复制对象或者数组，对象与数组可以被改变便，因为const 保证的指针不变4：let const 变量 为块级作用域5：let const 变量不能重复6: let const 会形成暂时性死区详细介绍promise1：因为传统异步是通过回到函数方式结果的，为了解决回调地狱导致代码可读性差，可维护成本，所以有了
2021-07-19 20:33:18
98
原创 2021-06-22
手写js中setTimerOut功能用原生setTimerOut和手写setTimerOut进行比较,可以让同学们更加深刻理解js原生setTimerOut setTimeout(function (a, b) { console.log('我执行了'); console.log('参数a', a); console.log(b); }, 2000, 'dddd', 123);手写setTimerOut /
2021-06-22 20:56:12
69
原创 2021-06-22
原生DOM经典案例百度轮播图自己见一个img文件夹放置图片,看代码规则的修改图片名称,和按钮图片<!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
2021-06-22 20:26:32
57
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人