weixin_44415368的博客

原创 redux 使用

介绍1.Store 就是把它们联系到一起的对象。Store 有以下职责：维持应用的 state；提供store. getState() 方法获取 state；提供 store.dispatch(action) 方法更新 state；通过 subscribe(listener) 注册监听器;通过 subscribe(listener) 返回的函数注销监听器。2.Action 是把数据从应用（译者注：这里之所以不叫 view 是因为这些数据有可能是服务器响应，用户输入或其它非 view 的数据

原创 搭建 react+redux环境

项目实录：安装create-react-app基础脚手架npm install -g create-react-app创建工程create-react-app react-redux-app进入工程cd react-redux-app启动工程npm startwebpack配置npm run eject安装redux相关库npm install redux --savereact-redux库npm install react-redux --save安装bable插件tra

原创 vscode写react代码标签自动补全带样式名(2020 7 3 亲测有效)

vscode ->文件->首选项->找到以下字段修改"emmet.includeLanguages": { "javascript": "javascriptreact" 重新启动

原创 NUXT框架

一. 什么是服务器端渲染1.服务端渲染服务器端渲染：后端先调用数据库，获得数据之后，将数据和页面元素进行拼装，组合成完整的HTML页面，再直接返回给浏览器，以便用户浏览例如：http://www.cnblogs.com/cate/design/2. 什么是客户端渲染客户端渲染：数据由浏览器通过ajax动态取得，在通过js将数据填充到dom元素上最终展示到网页中，这样的过程叫做客户端渲染。例如：https://h5.ele.me/misite/二. 服务器端渲染 vs客户端渲染1.服务器端渲染

原创 使用Git

https://www.jb51.net/article/126560.htm

原创 如何在手机等移动平台上浏览器网页中点击链接跳转到QQ聊天界面

移动端 浏览器<a target="_blank" style="color:#fff" href="mqqwpa://im/chat?chat_type=wpa&uin=1234567field='qq'}>&version=1&src_type=web&web_src=www.nbftjg.net"> 123456789</a&gt...

原创 在vue 框架或插件组件样式更改不了 的样式 使用 deep

引用文本<style scoped> /* 使用 scoped 更改的组件样式。 */ /* 此处只是举个栗子使用，没有经过验证。很多人会下面这摸写，但是发现改变不了B组件的样式，其实是 scoped 局部的，所以不能。 .boxA .my { color:red; } */ .boxA /deep/ .my { color:red; }<...

转载 vue.js监听属性watch(handler方法immediate属性deep属性)

vue.js监听属性watch(handler方法immediate属性deep属性)<div> <p>FullName: {{fullName}}</p> <p>FirstName: <input type="text" v-model="firstName"></p></div> ...

转载 记一个用VS2017写的Vue项目中组件出现中文乱码问题

在做一个小项目时遇到了，在写好的一个vue组件中出现了中文乱码，上网找了挺久多少没有发现问题所在。项目问题出现的组件如下：其实只要在这个组件中的中文都会出现乱码的情况，浏览器页面中如下图所示。问题所在主要是，文件默认是ASNI编码的，我们要转换成UTF-8就可以解决这个问题。解决方法：①打开该Vue组件文件所在的文件夹。②用记事本打开改Vue组件的文件③点击右上角的：文件 ==...

原创 vue-cli中的build.js配置文件详细解析

这是vue-cli脚手架工具的生产环境配置入口 package.json中的"build": "node build/build.js"的直接指向。//版本检查 node的版本号 版本有要求"engines": {“node”: “>= 4.0.0”,“npm”: “>= 3.0.0”}//立即执行require(’./check-versions’)()//process...

转载 Object.freeze()

Object.freeze()阻止修改现有属性的特性和值，并阻止添加新属性Object.freeze(object)返回值是传递给函数的对象。可以利用这个方法将对象彻底冻结，使其符合const变量的含义let obj = {a: 1,b: {b1: 2}};obj.b.b1 = 3;console.log(obj.b.b1 ); //3function freeze(o...

转载 Mint-ui 中的MessageBox confirm详细使用

##官方中文文档url: http://mint-ui.github.io/docs/#/zh-cn2/message-boxMint-ui官网文档并没有对该组件进行详细的demo演示，比如像修改一些btn文字就没有说明，自己有遇到，并参考其他网友的（https://blog.csdn.net/guoyiq/article/details/80222063）的博文，自己写个日记首先肯定要安装M...

原创 移动端怎么能让页面不缩放

原创 深入研究-webkit-overflow-scrolling:touch及ios滚动

-webkit-overflow-scrolling:touch是什么？*MDN上是这样定义的：-webkit-overflow-scrolling 属性控制元素在移动设备上是否使用滚动回弹效果.auto: 使用普通滚动, 当手指从触摸屏上移开，滚动会立即停止。touch: 使用具有回弹效果的滚动, 当手指从触摸屏上移开，内容会继续保持一段时间的滚动效果。继续滚动的速度和持续的时间和滚动...

转载 Vue打包后出现的bug -favicon.ico' because it violates the following Content Security Policy direc

打开vue的项目，但是页面显示的是Cannot GET，打开控制台之后，发现有一篇红色报错。//Refused to load the image 'http://localhost:8080/favicon.ico' because it violates the following Content Security Policy directive: "default-src 'non...

转载 Vue实现点击按钮复制文本内容

点击复制功能主要通过 clipboard.js 来实现在vue中使用clipboard.js 时候发现一个问题，就是如果不是input或者button 按钮的话，则复制不成功，使用步骤如下：1、引入clipboard.js，方法如下：第一种直接npm安装：npm install clipboard --save第二种：（下载地址：https://clipboardjs.com/）2、...

原创 Mint-ui MessageBox.confirm 确定和取消事件

Mint-ui MessageBox.confirm**问题: 怎么样写出确定和取消 事件标记文本删除文本引用文本 close(val){//关闭支付页面 MessageBox.confirm('您的订单在0小时29分钟内未支付将被取消，请尽快完成支付。','确认要离开收银台？').then(action=>{ if(action=='confirm'){ ...

转载 小程序开发--wx.getSetting 授权检测

wx.getSetting 在 未拒绝 和 未同意 状态下 ，success: (res) => { } 的res.authSetting{}值是空的!在getUserInfo()后，点击拒绝后 wx.getSetting的fail:(res)=>{}触发，res.authSetting[‘scope.userInfo’] 的值是false ，表示scope.userInfo这个权限...

转载 【小程序】使用button的open-type="getUserInfo"引导用户进行授权

一、 前言小程序官方文档，上面说明wx.getUserInfo(OBJECT) 注意：此接口有调整，使用该接口将不再出现授权弹窗，请使用<button open-type="getUserInfo"></button>引导用户主动进行授权操作当用户未授权过，调用该接口将直接报错 当用户授权过，可以使用该接口获取用户信息如上文，之前用户未授权过时，调用wx.ge...

原创 vue 出现不能向上滑动 的问题

vue报这个错[Intervention] Ignored attempt to cancel a touchmove event with cancelable=false, for example because scrolling is in progress and cannot be interrupted如何解决之前加了css样式*{touch-action: none}导致...

转载 vue+webpack+mintui+mui构建项目的时候出现的一些问题解决方法

vue+webpack+mintui+mui构建项目的时候出现的一些问题解决方法1.引入M-UI找不到相关资源文件我们可以把git上面下载的mui的js和css以及一些用到的文件拷贝到node_modules中再引入git地址:https://github.com/dcloudio/mui2.包含ttf的组件需要对ttf进行解析,需使用url-loader解析 { test: /\....

原创 vue打包后出现的bug http://localhost:3000/static/css/static/fonts/mui-icons-extra.683f395.ttf 404

ERROR in ./static/mui/fonts/mui.ttf 1:0Module parse failed: Unexpected character ‘’ (1:0)You may need an appropriate loader to handle this file type.(Source code omitted for this binary file)@ ./s...

转载 webpack打包vue项目之后怎么启动&注意事项

前端代码没有服务器可以部署到 express 服务器上运行1.执行：npm run build打包后生成dist文件夹安装express-generator生成器执行 $ npm install express-generator -g 进行安装创建一个express项目执行 $ express expressDemo （expressDemo是项目名）expressD...

转载 vue-cli脚手架创建vue项目并打包运行

1 安装 NPM，安装nodejs自带NPM，这个不是重点不详细说。2 安装 webpack，npm install webpack -g 执行全局安装，这个不是重点不详细说。3 安装 vue-cli 执行命令：npm install -g vue-cli4 查询vue版本 执行命令：vue -V5 创建项目目录G:\net\web\vue-cli-demo，进入项目目录执行命令： v...

原创 JS正则表达式验证身份证号码、真实姓名

js验证身份证号：var idNo = $('#id_card_no').val();var regIdNo = /(^\d{15}$)|(^\d{18}$)|(^\d{17}(\d|X|x)$)/; if(!regIdNo.test(idNo)){ alert('身份证号填写有误'); return false; } js验证真实姓名：.var nam...

转载 Vue中npm run build报“Error in parsing SVG: Unquoted attribute value” 打包出现的错误

js验证身份证号：var idNo = $('#id_card_no').val();var regIdNo = /(^\d{15}$)|(^\d{18}$)|(^\d{17}(\d|X|x)$)/; if(!regIdNo.test(idNo)){ alert('身份证号填写有误'); return false; } js验证真实姓名：.var nam...

转载 Vue组件选项props

转载 vue-cli中引入mui的相关问题解决

使用mui引入mui.js将mui放到vue-cli项目的src/assets路径下在webpack.base.conf.js中配置// 2.1 在webpack.base.conf.js的resolve中的alias中添加 mui当前行代码resolve: {extensions: [’.js’, ‘.vue’, ‘.json’],alias: {‘vue$’: ‘vue/dis...

翻译 Vue路由默认带有#号，如何去掉#号模式

你需要开启HTML5 History 模式vue-router 默认 hash 模式 —— 使用 URL 的 hash 来模拟一个完整的 URL，于是当 URL 改变时，页面不会重新加载。如果不想要很丑的 hash，我们可以用路由的 history 模式，这种模式充分利用 history.pushState API 来完成 URL 跳转而无须重新加载页面。const router = new...

转载 mint-ui的loadmore和mt-cell-swipe结合使用问题

现在下拉刷新和上拉加载更多是很常见的需求，并且在列表上的用户交互（比如删除当前列表项，标记当前列表项为收藏等）也是非常常见的需求，mint-ui提供了Loadmore组件和CellSwipe组件分别实现了上述两种功能。关于两个组件的详细使用，这里不废话了，官网的例子跑一边基本上就掌握了。这里主要介绍两者结合使用，完成常见的用户操作。直接看代码吧： ...

转载 vue实战记录（五）- vue实现购物车功能之商品总金额计算和单选全选删除功能 vue实战

一、单价商品的金额计算整个操作过程是，商品的数量是可以控制的，可增可减，最少为1。并且在数量的变化中，商品的总价也在变化。控制数量与总价的变化需要定义新方法。页面中的+和-控制数量的变化，当点击的时候调用changeMoney()函数，传递参数，通过数量的变化去改变金额。+的时候增1，-的时候减1。cart.html 二、单选选中商品在购物车中，需要选择当前想买的商品，...

转载 json对象和字符串的相互转换

复制代码//使用json中的parse方法转换；var str=’{“name”:“fendouer”, “age”:23}’; //这是一个json字符串’’var ob=JSON.parse(str) ; //返回一个新对象console.log(ob.name)//把json中的stringify对象转换成字符串var obj={“student”:[{“name”:...

转载 彻底理解cookie，session，token

发展史1、很久很久以前，Web 基本上就是文档的浏览而已， 既然是浏览，作为服务器， 不需要记录谁在某一段时间里都浏览了什么文档，每次请求都是一个新的HTTP协议， 就是请求加响应， 尤其是我不用记住是谁刚刚发了HTTP请求， 每个请求对我来说都是全新的。这段时间很嗨皮2、但是随着交互式Web应用的兴起，像在线购物网站，需要登录的网站等等，马上就面临一个问题，那就是要管理会话，必须记住哪...