随笔分类 -  web前端

前端
js 中 reduce() 用法
摘要：reduce()方法接受一个函数作为累加器，数组中的每个值（从左到右）开始缩减，最终计算为一个值。 reduce()可以作为一个高阶函数，用于函数的组成。 reduce（）对于空数组是不会执行回调函数的。 arr.reduce((pre,cur,index,arr) => { },init) pre 阅读全文
posted @ 2021-11-15 13:44 小黄花呐 阅读(400) 评论(0) 推荐(0)
vue中使用vant按需引入
摘要：babel.config.js plugins: [ ['import', { libraryName: 'vant', libraryDirectory: 'es', style: true }, 'vant'] ] 阅读全文
posted @ 2021-10-27 14:42 小黄花呐 阅读(115) 评论(0) 推荐(0)
async和await 异步处理
摘要：async 1. 它作为一个关键字放在函数前面，用于表示函数是一个异步函数。 2. 返回的是一个promise对象，如果想要获取到promise的值，就要使用then（）方法 3. 不可直接使用函数名（） 这样的形式调用异步函数，如果要这样使用，需要放在新定义的异步函数体内去调用 created() 阅读全文
posted @ 2021-10-25 16:00 小黄花呐 阅读(295) 评论(0) 推荐(0)
vue.$set 和 vue.$forceUpdate() 的使用
摘要：vue.$set方法 由于javaScript的限制，vue不能检测到对象属性的添加或删除 这样只能新增属性，但是并不会触发视图更新，所以属性必须是在data对象上才能让vue.js转换它，才能让他是响应式的 可以使用this.$set(this.data, "key" , "val") 方法，既可 阅读全文
posted @ 2021-10-21 14:45 小黄花呐 阅读(435) 评论(0) 推荐(0)
Mac M1芯片 安装nvm遇到的问题
摘要：nvm 安装 curl -o- https://raw.githubusercontent.com/nvm-sh/nvm/v0.37.2/install.sh | bash 安装完成，但是当终端关闭再打开nvm就会找不到 解决办法：新建～/.zshrc,然后执行 open ～/.zshrc 在zsh 阅读全文
posted @ 2021-10-19 14:11 小黄花呐 阅读(1195) 评论(2) 推荐(2)
this.$nextTick()
摘要：异步说明 vue 实现响应式并不是数据发生变化之后dom立即变化，而是按一定的策略进行dom的更新。 具体来说，异步执行的运行机制如下： 1. 所有的同步任务都在主线程上执行，形成一个执行线 2. 主线程之外，还存在一个“任务队列”，只要异步任务有个运行结果，就会在任务队列中放置一个事件 3. 一旦 阅读全文
posted @ 2021-10-19 11:30 小黄花呐 阅读(189) 评论(0) 推荐(0)
vue.config.js 基础配置
摘要：1. 项目打包之后默认放在dist文件中，可以通过outputDir，assetsDir，indexPath改变默认打包位置。 module.exports = { outpurDir: './Web', // 文件打包生成环境构建文件目录，默认为dist目录 assetsDir: 'vue-adm 阅读全文
posted @ 2021-10-19 10:20 小黄花呐 阅读(288) 评论(0) 推荐(0)
computed和watch
摘要：一：computed 依赖其他属性计算值，当值发生变化时才会进行计算，只要值不变化，访问时返回的结果还是以前返回的结果而不会重新计算。但是计算属性不支持异步，当comouted中有异步操作时是无效的，无法监听数据的变化。 和watch区别：计算属性初始化的时候就可以被监听到并计算，但是watch是监 阅读全文
posted @ 2021-10-18 18:11 小黄花呐 阅读(70) 评论(0) 推荐(0)
vue Style 与 Class 样式绑定
摘要：1. class // 对象形式 <div v-bind:class="{ active: isActive }"></div> // 多个class样式 active是css中定义的class类名，'text-danger' 是样式，要加引号 <div class="static" v-bind: 阅读全文
posted @ 2021-10-13 10:28 小黄花呐 阅读(60) 评论(0) 推荐(0)
常见的多行文本展开收起功能 及 getComputedStyle()
摘要：在许多项目中有一些详情功能，需要用到‘展开’，‘收起’的功能，内容超出规定的行数后开启展示收起的功能效果。 思路： 首先需要判断文本是否超出规定的行数，这些一般都是异步请求渲染到页面上的，可以使用nextTick来监听DOM中的数据变化。然后设置css 这个方法和思路都是简单的一种 核心代码 <te 阅读全文
posted @ 2021-09-10 16:50 小黄花呐 阅读(338) 评论(0) 推荐(0)
vue自定义指令 v-drag拖拽
摘要：1. 在drag.js文件中添加 /* * 拖拽指令 */ export default { inserted(el) { // 这里的el是标签中的v-drag let positionParams = { x: 20, y: 105, startX: 0, startY: 0, endX: 0, 阅读全文
posted @ 2021-09-01 11:54 小黄花呐 阅读(884) 评论(0) 推荐(0)
vue中keepAlive缓存及缓存下的钩子函数
摘要：在开发中，经常有从列表跳转到详情页，再返回的时候之前的状态就没有了，所以需要缓存列表页的状态，这时候就需要保存状态，vue中提供了keep-alive组件来缓存状态 利用meta标签 1. 首先在路由中的meta标签中记录meta的属性为true { path: "/userInfo", compo 阅读全文
posted @ 2021-08-25 18:06 小黄花呐 阅读(1327) 评论(0) 推荐(0)
vue路由对象属性
摘要：1. $route.path Type : " String ", 字符串，对应当前路由的路径，总是解析为绝对路径，如 /foo/bar 2. $route.parmas Type : " Object " , 一个 key/value 对象，包含了动态片段和全匹配片段，如果没有路由参数，就是一个空 阅读全文
posted @ 2021-08-20 15:32 小黄花呐 阅读(395) 评论(0) 推荐(0)
md5加密
摘要：md5是一种常用的哈希算法，主要用于对一些重要数据的“签名”，最终得到的“签名”通常是一个16或32位的十六进制的字符串 实际开发工作中，是不会有人将密码明文直接放在数据库中的，因为这种做法是十分不安全的，一般要对其进行MD5加密，比如某用户的密码是“123456“（当然这样的密码也没有安全性可言） 阅读全文
posted @ 2021-08-17 10:30 小黄花呐 阅读(842) 评论(0) 推荐(0)
常用的（数组or 对象）循环方法总结
摘要：数组 1. map ( item，index, arr(原数组) ) 返回一个新的数组，数组中的元素为原始数组调用函数处理后的值，不会改变原始数组。 可以return 1 let arr = [1,2,3]; 2 let tt = arr.map(function(i){ 3 console.log 阅读全文
posted @ 2021-08-13 15:08 小黄花呐 阅读(257) 评论(0) 推荐(0)