Yo,的博客

天赋不够，后天来凑。。。。哈哈，初学Vue，记录一下。Vue-cli是vue官方出品的快速构建单页应用的脚手架。一、安装vue-cli1.http://nodejs.cn/ 安装Node.js   1.win+R开启命令行工具,2....

      先想象一个基本需求，就是在我们点击导航菜单时，跳转页面上能显示出当前页面的路径，来告诉用户你想在所看的页面位置（类似于面包屑导航）一.用name传递参数两步完成用name传值并显示在模板里：①在路由文件src/router/index.js里配置name属性。routes: [{ path: '/', name: 'Hello', component: ...

我们知道一个组件从进入到销毁有很多的钩子函数，同样在路由中也设置了钩子函数。路由的钩子选项可以写在路由配置文件中，也可以写在我们的组件模板中。一.路由配置文件中的钩子函数/src/router/index.js路由文件中我们只能写一个beforeEnter,就是在进入此路由配置时。{ path:'/params/:newsId(\\d+)/:newsTitle', ...

 state ，这个就是我们说的访问状态对象，它就是我们SPA（单页应用程序）中的共享值。如何把状态对象赋值给内部对象，也就是把stroe.js中的值，赋值给我们模板里data中的值。我们有三种赋值方式。一、通过computed的计算属性直接赋值computed属性可以在输出前，对data中的值进行改变，我们就利用这种特性把store.js中的state值赋值给我们模板中的data值。...

上篇是读取state，这篇是修改状态。即如何操作Mutations。一.$store.commit( )Vuex提供了commit方法来修改状态1.store.js文件const mutations={ add(state){ state.count++ }, reduce(state){ state.count-- ...

现在最流行的三个前端框架，可以说和webpack已经紧密相连，框架官方都推出了和自身框架依赖的webpack构建工具。React.js+WebPack Vue.js+WebPack AngluarJS+WebPack什么是WebPack？WebPack可以看做是模块打包机：它做的事情是，分析你的项目结构，找到JavaScript模块以及其它的一些浏览器不能直接运行的拓展语言（Sas...

vux 获取表单验证校验的返回值isType 自定义的方式isTypevux使用x-input情形如下：表单中需要填写手机号，填完手机号之后，进行提交。点击“提交”按钮的时候，需要判断手机号是否通过校验，vux提供了is-type内置验证器，我们省去了自己校验手机号的过程。 <x-input required title="手机号码" v-model="pho...

<template> <div> <h2>devicebase 页面</h2> <button @click="addSlice">添加1 slice用法</button><br> <span v-for="item in list&qu

（一）绝对路径直接引入：（1）主入口页面index.html中头部script标签引入：<script type="text/javascript" src="http://api.map.baidu.com/api?v=2.0&ak=n0S34gQ0FW73Vj7X13A4y75q"></script> （2）build/webpack.base.c...

1.v-modelv-model指令，我理解为绑定数据源。就是把数据绑定在特定的表单元素上，可以很容易的实现双向数据绑定。经常和{{}}胡子语法配合在html中使用， ps: {{}} === v-text直接看代码 <p>********v-model绑定数据源，实现双向绑定</p> <div> <p&gt...

1.命名路由    有时候，通过一个名称来标识一个路由显得更方便一些，特别是在链接一个路由，或者是执行一些跳转的时候。你可以在创建 Router 实例的时候，在 routes 配置中给某个路由设置名称。我个人理解就相当于给路径取个名字，调用的时候，这个名字就指这个路径，不然有些路径很长，直接写太麻烦。const router = new VueRouter({ routes: [ ...

一.新建一个Vue实例可以有下列两种方式：1.new一个实例var app= new Vue({ el:'#todo-app', // 挂载元素 data:{ // 在.vue组件中data是一个函数，要写成data () {}这种方式 items:['item 1','item 2','item 3'], todo:'' }, methods:{ // ...

一.使用vue-router路由跳转页面    1.使用Vue.js做项目，一个页面是由多个组件组成，所以在跳转页面的时候，并不适合用传统的“href”方式，于是vue-router应运而生。官方文档：https://router.vuejs.org/zh-cn/essentials/getting-started.html本次项目结构：                              ...

VUX组件主要是用来做微信端的一些项目，合理利用vux组件可以让我们的工作效率更高。<1>. 在项目里安装vuxnpm install vux --save (安装到dependencies)或者是 npm install vux --S <2>. 安装vux-loader （vux文档中没有明文跟你说要安装）npm install vux-loade...

一.下载微信开发者工具https://developers.weixin.qq.com/miniprogram/dev/devtools/download.html下载好后界面如下：二.在命令行运行项目，npm run dev三.在上张图片的红框内输入项目URL地址，如：http://localhost:8080之后就能在该软件界面看到我们的项目，具体调试方法和浏览器一摸一...

一.简介上一篇博客一个小demo提到了一点vue-router的用法，还是不能完全掌握，现又有了一点新的理解与体会，故添加在这篇博客中。vue-router的官方文档在这里，https://router.vuejs.org/zh/。二.具体内容1.命令行运行项目工程npm run dev2.安装路由:npm install vue-router -S 之后打开我们的项目文件，在底部...

一.简介在我们的工程项目中，使用一些第三方组件如Element-ui，Bootstrap等，可以让我们更快更好地完善美化设计我们的项目。可以省去很多时间，重要的是这些组件有时候比我们自己做的的效果要更好。二.具体做法。1.新建Vue项目1. vue init webpack vue-study7.21 // 生成项目2. cd vue-study7.21 // 进入项目目录3...

 一.如果用户在微信客户端中访问第三方网页，公众号可以通过微信网页授权机制，来获取用户基本信息，进而实现业务逻辑。二.关于网页授权的两种scope的区别说明1、以snsapi_base为scope发起的网页授权，是用来获取进入页面的用户的openid的，并且是静默授权并自动跳转到回调页的。用户感知的就是直接进入了回调页（往往是业务页面）2、以snsapi_userinfo为scop...

一.简介最近再学一些关于微信公众号网页开发的东西，这里用了vue框架搭建。遇到了几个问题，写在这里，以作记录。二.具体内容1.从后台拿数据，同步地渲染到页面上。①首先是配置API请求 userAlways: function (param) { return axios({ url: 'url地址', method: 'get', ...

 参考文档：微信公众平台、踩坑记录一.简介  JS-SDK需要向服务端获取签名，且获取签名中需要的参数包括所在页面的url，但由于单页应用的路由特殊，其中涉及到iOS和android微信客户端浏览器内核的差异性导致的兼容问题。微信JS-SDK是微信公众号平台 面向网页开发者提供的基于微信内的网页开发工具包。通过使用微信JS-SDK，网页开发者可借助微信高效地使用拍照、选图、语音、位置等...

vuex在页面刷新后数据被清除的问题最近在用vue写pc端项目，用vuex来做全局的状态管理， 发现当刷新网页后，保存在vuex实例store里的数据会丢失1. 产生原因其实很简单，因为store里的数据是保存在运行内存中的,当页面刷新时，页面会重新加载vue实例，store里面的数据就会被重新赋值。2. 解决思路一种是state里的数据全部是通过请求来触发action或mutation...