05 2021 档案
摘要:由于 被better-scroll 管控的 元素的点击事件都是通过 better-scroll 同意分发的 ,所以 某些使用 一定只允许存在一个 better-scroller 实例!!! 假如 点击元素 显示一个可以滚动的列表 如果点击不判断是否已经存在better-scroll实例的话, 点击一
阅读全文
摘要:在开发过程中,我们时常会遇到这样一种情况:当vue的data里边声明或者已经赋值过的对象或者数组(数组里边的值是对象)时,向对象中添加新的属性,如果更新此属性的值,是不会更新视图的。 根据官方文档定义:如果在实例创建之后添加新的属性到实例上,它不会触发视图更新。 当你把一个普通的 JavaScrip
阅读全文
摘要:无效原因: 当元素被 better.scroll实例接管后, 里面的所有子元素元素的点击事件都会被阻止, 需要加上 配置第二个参数 {click: true } 统一由 BScroll这个实例分发点击事件!!! this.fBS = new BScroll('wrapper', {probeType
阅读全文
摘要:在实现登录模块时,在验证码这里碰到一个坑就是: 问题:后台nodjs 生成一张svg的验证码图片并且返回到前端,并且把验证码放入到session中。 但是前台验证的时候验证码死活都不成功。 排查原因,百度后发现是因为浏览器请求后台nodejs 验证码接口时产生了跨域,而恰好前台是直接调用的验证码接口
阅读全文
摘要:这里的原因是因为vue中异步取值时候【mapState 映射出 vuex 中的数据等】,很多时候 会得到 {ob:Observer}的数据格式, 这是因为vue对数据设置的监控器【一般是不可枚举的】。 直接取值是取不到这个对象里面的值的。 可以通过 几种方式: 1.展开语法 :[...ob_obj]
阅读全文
摘要:1.权限不够 2.没有删除文件变量 // 需要添加 unset($file); 3.例如excel等文件在word中打开状态,未关闭,导致删除失败!!!
阅读全文
摘要:很多时候界面的很多内容都需要等到异步请求的数据请求成功而动态加载的,为了提高用于体验,可以在数据未加载之前,显示一个与界面结构相同的图片。表示数据正在加载!!! ex: Vue中可以使用 v-if:数据来了就执行v-if,显示真正的界面结构 v-else:数据没来就显示v-else里的图片结构 结合
阅读全文
摘要:很多时候轮播组件,分类展示等组件的数据源不是直接写在data属性中,而是异步获取然后循环渲染出来的。这时候轮播效果的渲染往往需要等到数据获取到并且循环数据完之后再去执行。什么时候判断 数据获取完成并且数据循环生成dom操作 也已完成? 这是个问题。 vue 提供了一个 叫 $nextTick(cal
阅读全文
摘要:<myheader :title="Position.name" ref="myh" @click="showtitle"> 查阅vue官方文档,得知click事件作用于组件内部,如果组件内没有写click事件,便会无响应。 解决办法:加上 .native 原生修饰符 <myheader :titl
阅读全文
摘要:因为一般都会通过vue-cli 脚手架去初始化一个vue项目模板. 个人习惯在 src 中新建一个store.js【向外export一个vuex 的 Store实例】 用于当做 vuex核心文件, 然后建立 state.js/mutations.js/actions.js/getters.js【分别
阅读全文
摘要:1.跨域 config/index.js 主配置文件中 dev 属性下 proxyTable 配置代理信息: proxyTable: { '/api': { // 匹配所有以 '/api'开头的请求路径 target: 'http://localhost:4000', // 代理目标的基础路径 //
阅读全文
摘要:1、v-if v-else 指令 2.v-show 3.display:none & opacity:0【通过属性绑定还是 ref获取到dom元素在设置display:none 或者 设置透明度即可】 && 把元素移到文档可视区之外(transform:translate()) 【变相隐藏,显示,结
阅读全文
摘要:1.pros+ 属性绑定 2.事件绑定 $emit('func',{}) 3.slot 插槽 【传递标签,组件以及里面的数据】 4.vuex 5.Eventbus 6.通过父组件进行中转
阅读全文
摘要:1.日期 let date = new Date(); let date1 = Date(); console.log(date, date1); /* 日期!!! date date1 其实不一样! date =>object date*1就返回unix时间戳 小技巧!!!还有几种方式 Numbe
阅读全文
摘要:1.jsonp 只允许发送GET请求, 不允许发送POST方式请求!! 2.跨域实现之一,iframe 设置 document.domain 可以实现跨域 3.html5 新特性一、绘画 canvas HTML5 标签用于绘制图像(通过脚本,通常是 JavaScript)。 二、用于媒介回放的vid
阅读全文
摘要:事件绑定:顾名思义就是给页面上的元素绑定事件(处理程序),分为动态绑定和静态绑定。 静态绑定,也是最直接的事件绑定【通过事件属性,直接显示的给元素绑定事件,例如 <div onlick="myfunc()" onmouseover="myfunc2()" ><script> function myf
阅读全文
摘要:Vue-cli是vue官方出品的快速构建单页应用的脚手架。可以帮助我们快速搭建开发所需要的环境,省去很多精力!这样你可以专注在撰写应用上,而不必花好几天去纠结配置的问题。这里头牵扯的内容也比较多。 webpack,npm,nodejs,babel都包括在内! 1.1 安装 vue-cli 官网:ht
阅读全文
摘要:hosts中加入 13.114.40.48 github185.199.109.154 github.githubassets.com185.199.111.154 github.githubassets.com185.199.108.153 assets-cdn.github.com185.199
阅读全文
摘要:今天想把一个本地项目推送到github【此前已经将这个项目推送到gitee!】 执行 git remote add origin +远程仓库地址 这个命令时,提示 error: remote origin already exists. 这是因为gitee&github 默认都是以 origin 这
阅读全文
摘要:今天想把在公司写的一些代码上传的github上,将本地仓库和远程仓库关联起来,执行: 【git push -u origin main 】 把本地main branch的代码推送到远程的main branch时,报错: ! [rejected] main -> main (fetch first)
阅读全文
摘要:stylus stylus个人通俗一点认为就是css的框架,可以简化css代码的书写,和支持一些模块化的使用方式! base.stylu文件中: RemoveDefault() appearance: none border:none outline: none$red = rgb(255,69,0
阅读全文
摘要:webpack为开发者提供了 三种方式去实现自动监听文件的变化重新打包,用的比较多的就是-webpack-dev-server这个插件。 使用: 1.npm install -D webpack-dev-server 安装 webpack-dev-server 2.配置简易指令,package.jo
阅读全文
摘要:老规矩,介绍几个常用的插件【在某个时间点,自动执行的处理程式】,后续碰到其他的,去官网上看api使用文件即可!! html-webpack-plugin 【详情https://www.webpackjs.com/plugins/html-webpack-plugin/】 这个插件是帮助webpack
阅读全文
摘要:webpack官方提供了非常多的loader,每个都记住不太容易,可以去 官方中文网站:https://www.webpackjs.com/,去查阅一些loader的使用方法。下面就挑选几个常用的loader做讲解使用[大前提就是npm 先安装对应的loader]。 使用file-loader: 《
阅读全文
摘要:认识webpack 1.什么是webpack Webpack 是一个打包模块化 JavaScript 的工具,在 Webpack 里一 切文件皆模块,通过 Loader转换文件,通过 Plugin注入钩子,最后输出由多个模块组合成的文件。 Webpack专注于构建模块化项目。 webpack是一个前
阅读全文
摘要:1 <!DOCTYPE html> 2 <html lang="en"> 3 4 <head> 5 <meta charset="UTF-8"> 6 <meta name="viewport" content="width=device-width, initial-scale=1.0"> 7 <t
阅读全文
摘要:1 <!DOCTYPE html> 2 <html lang="en"> 3 4 <head> 5 <meta charset="UTF-8"> 6 <meta name="viewport" content="width=device-width, initial-scale=1.0"> 7 <t
阅读全文
摘要:某些时候一个父组件里面嵌套有子组件,然后希望展示父组件时,子组件也能够随着一起展示。 这时候就需要用到路由嵌套,不然单独为两个组件定义访问路由,子组件会直接覆盖父组件,而不是一起出现! <!DOCTYPE html> <html lang="en"> <head> <meta charset="UT
阅读全文
摘要:Hash路由:移步https://www.cnblogs.com/joyho/articles/4430148.html 路由使用例子【笔记有些许凌乱】: 1 <!DOCTYPE html> 2 <html lang="en"> 3 <head> 4 <meta charset="UTF-8"> 5
阅读全文
摘要:1.prop, 父组件向子组件传值的两个步骤 属性绑定: :attr="myattr" props:['myattr'], 中注册这个属性。 但是需要注意的时,子组件中可以使用这个myattr, 但是官方不推荐直接去修改这个myattr。非要修改就在子组件自己的data属性中定义一个变量存放myat
阅读全文
摘要:前面也提到过,Vue是不提倡用原生js或者第三方库【jquery】去获取并操作dom元素的。但是这种需求不可避免,Vue官网提供了一个ref属性,用于我们在自定义方法中去获取具有这个ref属性的元素。 <!DOCTYPE html> <html lang="en"> <head> <meta cha
阅读全文
摘要:Vue中,默认子组件无法直接取得父组件中的数据!所以才需要进行传值操作! 父组件通过属性绑定形式向子组件传值: <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatib
阅读全文
摘要:方式一:v-show 或者 v-if&v-else,通过控制一个标志位的bool值来实现组件的切换 [] 方式一有局限性,就是只能控制两个组件间的切换,因为bool值就true和false两个。 方式二:使用vue官方提供的<component>标签,通过给这个标签绑定is属性实现多个组件之间的切换
阅读全文
摘要:<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document<
阅读全文
摘要:Vue自带的动画效果通过六个类实现: v-enter:定义进入过渡的开始状态。在元素被插入之前生效,在元素被插入之后的下一帧移除。 v-enter-active:定义进入过渡生效时的状态。在整个进入过渡的阶段中应用,在元素被插入之前生效,在过渡/动画完成之后移除。这个类可以被用来定义进入过渡的过程时
阅读全文
摘要:由于Vue是不推荐再去直接操作DOM元素的,所以Vue开发中,不建议再去使用Jquery中的ajax去发送异步请求。 推荐做法是: 使用vue官方推出的 vue-resource.js 使用axios.min.js 使用例子: <!DOCTYPE html> <html lang="en"> <he
阅读全文
摘要:<!-- vue 实例从被创建,运行,到销毁期间,会执行各种各样的事件函数,这些事件统称为生命周期 --> <body> <div id="app"> </div> </body> <script> let vm = new Vue({ el:'#app', data:{ vmsg:'vue tex
阅读全文
摘要:有时候表单登录验证时,希望通过敲回车就去验证,而不需要去移动鼠标点击按钮才验证,这个小功能就需要用到按键修饰符 语法: @keyup.enter=‘func’ //表示鼠标回车被按下抬起时,执行func这个函数里面的逻辑. 更多参阅:https://cn.vuejs.org/v2/guide/eve
阅读全文
摘要:过滤器【filter】用于 {{ }} 差值表达式和 v-bind这两个场景比较多!这里就介绍插值表达式场景 插值表达式: 过滤器语法 {{msg | filter_name(args1,args2,args3【可以传参数,然后调用过滤器方法filter()中用第二个形参接收这里传的第一次参数,以此
阅读全文
摘要:同:控制元素的隐藏和展示 异: v-if每次都会重新删除或者添上这个元素, 而v-show只是添加或者移除 display:none这个属性 v-if有较高的切换性能消耗,v-show有较高的初始渲染消耗 v-for指令:类似于for循环 用法: html: <div id="app"> <ul>
阅读全文
摘要:a1:v-bind:属性绑定 a2:v-on:事件绑定 a3:v-model:数据双向绑定,一般用于表单元素 v-bind:title,绑定title属性,简写: 【:title='title_info'】,绑定多个:【:class=["red", isBig?'big':'' ],绑定red cl
阅读全文
摘要:之前vue学习完,做了一个手机端案例demo后,部门就案子不断,虽然案子中多少有用到一点vue,但是没深入使用,因为老板为了更快给客户反馈,而且案子逻辑比较单一,用的也多偏原生。大半年过去了,有的知识点记忆模糊了。最近有空,稍微在系统学习和温习一遍把。 a1.插值表达式{{ }} a2.v-text
阅读全文
摘要:用到的包: "dependencies": { "mysql": "^2.18.1", "node-schedule": "^1.3.2", "nodemailer": "^6.4.17", "pm2": "^4.5.1" }, "devDependencies": { "art-template"
阅读全文
摘要:今天实现上传文件和指定路径下文件进行对比时,用到了这个array_map方法,传入的回调函数里面执行 array_splice()方法时,却报错第一个参数不是一个数组,给定的null。 起初在array_map回调 外打印 传入到array_splice中的数组,却发现类型正确是数组并且有值,苦恼了
阅读全文