![](https://img-blog.csdnimg.cn/20201014180756923.png?x-oss-process=image/resize,m_fixed,h_64,w_64)
Vue
跳跳呦�
这个作者很懒,什么都没留下…
展开
-
公众号注册+测试号调试+微信自定义分享+获取openid+相关配置
一、公众号简介访问地址:https://mp.weixin.qq.com以下内容截取自官网:二、公众号-个人订阅号注册最后一步由于本人个人申请已达上限,所以未能进行最后一步,进行到这一步填写公众号信息基本就完事儿了~到这一步,就能愉快的自定义菜单和写公众号文章了,不过这不是本文的重点,不再赘述~三、公众号-企业服务号注册由于个人条件有限,无法实现申请企业号,仅列不同于个人公众号的点,基本类似,后续补充四、测试号申请访问地址:http:/原创 2021-01-19 09:28:29 · 414 阅读 · 0 评论 -
vue打包发布到服务器注意事项
1.utils.js //防止CSS中图片引入路径报错 if (options.extract) { return ExtractTextPlugin.extract({ use: loaders, fallback: 'vue-style-loader', publicPath:'../../' })} else { return ['vue-style-loader'].concat(loaders)}//生产环境时进行CSS压缩const css原创 2021-01-18 17:38:41 · 190 阅读 · 0 评论 -
JS根据当前时间计算相差年月日时的时间
function getFormatDate(type, num) { let currentDate = new Date(); let resultDate = currentDate; let formatYMD; let day = 0,month = 0,year = 0; if (type === 'y') { // 按年份计算 resultDate = currentDate.setFullYear((currentDate.getFullYear() +原创 2021-01-18 17:31:33 · 303 阅读 · 0 评论 -
webstorm2019版本创建VUE项目
前言在论坛里发现有小伙伴使用2019版本的webstorm创建VUE项目的时候失败了,突然一想我也是2019的,后来没创建过,于是我就试了一下,如图:啊哈 什么东西,稀奇古怪的错误不管他,先运行下试试看啥结果哦豁,很敏感的字眼,no such file or directory, open ‘E:\untitled2\package.json’npm ERR! enoent Th...原创 2020-01-08 17:44:24 · 3189 阅读 · 7 评论 -
vue路由----编程式导航
import Vue from 'vue'import VueRouter from 'vue-router'Vue.use(VueRouter)const Home = { template:` <div> <h2>Home</h2> <p>this is Home -{{$route.query....原创 2019-07-09 17:55:50 · 116 阅读 · 0 评论 -
箭头函数Arrow Function
最近在学习vue的时候遇到了关于箭头函数的使用,因此学习后在这里一起分享一下。箭头函数:ES6标准新增的一种新的函数(Arrow Function),可以把它们看作是能附加在单击事件或鼠标事件上的一次性函数,箭头函数相当于匿名函数,并且简化了函数定义缺点:不能用来声明一个函数,也不能够通过 new 关键字新建对象实例eg:x => x*x 等价于:function (x) ...原创 2019-07-18 21:29:14 · 291 阅读 · 1 评论 -
chrome中安装devtools插件
1.安装vue.js和node.js直接略过,有需要可以查询我以前写过的步骤;2.下载devtools插件https://github.com/vuejs/vue-devtools,建议使用git下载;3.记得你下载第二步时文件的位置,进入运行cmd(安装git直接在当前文件夹在右键 git base here更方便),依次执行命令 npm install npm run build...原创 2019-07-16 17:38:30 · 302 阅读 · 0 评论 -
使用vue制作简单的登录页面(含验证码)
话不多说,先看结果,时间匆忙,样式没有怎么调整,能看就行,图片都懒得换了 qwq…同样,为了进行后续的拓展,使用的简单的路由功能(其实就是懒得换)首先便是项目的创建,这个不再过多叙述,接下来修改部分文件:1.index.html中添加样式,修改背景颜色<style> body{ background: #fff1ff; } &l...原创 2019-07-24 11:01:32 · 12210 阅读 · 5 评论 -
vuex之state、Mutations、getters、actions、modules
1.文件创建当然,文件创建的位置自己可以定,本文例子都在src文件夹下进行创建。main.jsimport Vue from 'vue'import store from './store'import vuex_test from './vuex_test.vue'new Vue({ el:'#app', store, render:xx=>xx(vuex_te...原创 2019-07-17 14:39:56 · 433 阅读 · 0 评论 -
Axios API
最近刚开始接触vue项目,遇到了axios,不可避免的有点迷茫,于是查资料对其有所总结。在查它的时候又看到了它和jquery的ajax和fetch.在这里简单的对三者进行对比并详细说明一下我是怎样通过Axios API 调取接口的。三者对比参考自https://blog.csdn.net/twodogya/article/details/80223508Ajax$.ajax({ typ...原创 2019-07-22 18:09:14 · 321 阅读 · 0 评论 -
vue2.0父子组件通信
效果图:传值前:传值后:1.父组件向子组件传值的两种情况a.给子组件传静态的值:<blog-post title="My journey with Vue"></blog-post>比较简单,不再赘述b.动态的值,v-bind绑定,简写 使用 :动态传值可以传数字,布尔型,数组,对象等,本文以传对象的两种方式为例,顺便包含传字符串,布尔值两种情况。...原创 2019-08-05 14:05:19 · 120 阅读 · 0 评论 -
内置组件+is实现动态组件
官网定义:实例:动态点击以后:代码解析:点击事件触发以后动态的将某个组件赋值给showComponent,is动态绑定的那里便会发生变化代码:<template> <div> <button @click="change('1')" style="background-color: greenyellow">组件1</but...原创 2019-08-05 15:26:19 · 155 阅读 · 0 评论 -
vue生命周期以及执行顺序
前言:Vue实例有一个完整的生命周期,也就是从开始创建、初始化数据、编译模板、挂载Dom、渲染→更新→渲染、卸载等一系列过程,我们称这是Vue的生命周期。通俗说就是Vue实例从创建到销毁的过程,就是生命周期created官方定义:实例创建完成后被立即调用,在这一步,实例已完成以下配置:数据观测 (data observer),属性和方法的运算,watch/event 事件回调。然而,挂载...原创 2019-08-06 10:27:07 · 4498 阅读 · 1 评论 -
vue路由----勾子
1.在idea中新建vue项目2.main.js中修改import Vue from 'vue'import Router from './transitionRouter'3.src下新建文件transitionRouter.jsimport Vue from 'vue'import VueRouter from 'vue-router'Vue.use(VueRouter)c...原创 2019-07-09 17:18:38 · 105 阅读 · 0 评论 -
命令行初次搭建vue环境和vue项目
1.在这之前我一直有个疑问,为什么搭建vue项目要基于nodejs环境,于是我查找了许多大神的解释,找到几种解答:Java角度:https://blog.csdn.net/myKurt/article/details/79914078了解更多详情前端角度:https://blog.csdn.net/wenshu12321/article/details/620716112.接下来就是...原创 2019-07-04 10:00:45 · 295 阅读 · 1 评论 -
$mount-手动挂载
1.定义在项目中可用于延时挂载(例如在挂载之前要进行一些其他操作、判断等),之后要手动挂载上,new Vue时,el和mount并没有本质上的不同。2.与el区别:将实例化后的vue挂载到指定的dom元素中,如果在实例化vue的时候指定el,则该vue将会渲染在此el对应的dom中;若没有指定el,则vue实例会处于一种“未挂载”的状态,此时可以通过mount来手动执行挂载。3.注意:如...原创 2019-07-08 11:28:26 · 381 阅读 · 0 评论 -
vue路由-----基础路由用法
1.在idea中新建vue项目2.main.js中修改import Vue from 'vue'import Router from './Router' /*引用自同级Router.js*/3.新建Router.js文件/*路由简介*/import Vue from 'vue'import VueRouter from 'vue-router'Vue.use(VueR...原创 2019-07-08 17:54:01 · 119 阅读 · 0 评论 -
vue路由----子路由,路由中参数的传递
1.在idea中新建vue项目2.main.js中修改import Vue from 'vue'// import Router from './Router' /*引用自同级Router.js*/import Router from './SonRouter' /*引用自同级SonRouter.js*/3.src下新建文件SonRouter.js/*子路由*/i...原创 2019-07-08 18:00:02 · 570 阅读 · 0 评论 -
vue路由----路由表的组建群
1.在idea中新建vue项目2.main.js中修改import Vue from 'vue'// import Router from './Router' /*引用自同级Router.js*/// import Router from './SonRouter' /*引用自同级SonRouter.js*/import Router from './Component...原创 2019-07-08 18:06:52 · 876 阅读 · 0 评论 -
vue动态添加删除数据
<template> <div class="hello"> <h1>{{ msg }}</h1> <h3>vue动态添加删除数据</h3> <input class="addWord" v-model.lazy="name" @focus="" @blur="nameVertify" @ke...原创 2019-07-09 10:03:44 · 1413 阅读 · 0 评论 -
vue路由----url传值
1.在idea中新建vue项目2.main.js中修改原创 2019-07-09 11:46:07 · 320 阅读 · 0 评论 -
vue路由----append、exact、query属性
1.在idea中新建vue项目2.main.js中修改import Vue from 'vue'// import Router from './Router' /*引用自同级Router.js*/// import Router from './SonRouter' /*引用自同级SonRouter.js*/// import Router from './Compon...原创 2019-07-09 13:50:11 · 4171 阅读 · 0 评论 -
vue路由----重定向、alias别名
1.在idea中新建vue项目2.main.js中修改import Vue from 'vue'// import Router from './Router' /*引用自同级Router.js*/// import Router from './SonRouter' /*引用自同级SonRouter.js*/// import Router from './Compon...原创 2019-07-09 13:55:38 · 1391 阅读 · 0 评论 -
vue路由----动画transition,watch监控动画
1.在idea中新建vue项目2.main.js中修改// 基础动画import transition from './transition.vue'import Vue from 'vue'new Vue({ el:'#demo', render:xx => xx(transition)})3.src下新建文件transition.vue<templa...原创 2019-07-09 15:14:44 · 583 阅读 · 0 评论 -
vue路由----404页面单独跳转
定义404错误模版并配置路径import Vue from 'vue'import VueRouter from 'vue-router'Vue.use(VueRouter)const Home = { template:` <div> <h2>Home</h2> <p>this is Home</...原创 2019-07-09 16:11:38 · 5292 阅读 · 0 评论 -
vue路由----将完整的vue组件作为模版
1.在idea中新建vue项目2.src文件夹新建transition.vue,src/components下新建HelloWorld.vue文件位置:transition.vue<template> <div> <!--模版中必须有一个这样的根元素--> <button v-on:click="show =! sh...原创 2019-07-09 16:20:01 · 192 阅读 · 0 评论 -
vue路由----mode参数配置history.hash
hash JavaScript中原始用法,比正常路径多了一层#const router = new VueRouter({ mode:'history', /* 两个参数 history, hash JavaScript中原始用法,比正常路径多了一层# http://localhost:8080/#/Users*/ data(){ return{ aa...原创 2019-07-09 16:22:31 · 931 阅读 · 0 评论 -
v-model指令
v-model指令 将数据和页面元素进行双向绑定<p>v-model:{{text}}</p> <p>v-model.lazy:{{text1}}</p> <p>v-model.number:{{ typeof(text2) }}</p> <p>v-model.trim:{{text3.len...原创 2019-07-02 10:31:04 · 181 阅读 · 0 评论