![](https://img-blog.csdnimg.cn/20201014180756913.png?x-oss-process=image/resize,m_fixed,h_64,w_64)
vue
文章平均质量分 61
斌哥谈编程
笔记记录、干货分享、共同学习
展开
-
Vue3快速上手
Vue3快速上手1.Vue3简介2020年9月18日,Vue.js发布3.0版本,代号:One Piece(海贼王)耗时2年多、2600+次提交、30+个RFC、600+次PR、99位贡献者github上的tags地址:https://github.com/vuejs/vue-next/releases/tag/v3.0.02.Vue3带来了什么1.性能的提升打包大小减少41%初次渲染快55%, 更新渲染快133%内存减少54%…2.源码的升级使用Proxy原创 2021-11-08 15:21:27 · 168 阅读 · 0 评论 -
vue2中Options API及vue3中Composition API 的区别对比
一、代码组织区别在vue2组织代码时,我们会在一个vue文件中methods,computed,watch,data中等等定义属性和方法,共同处理页面逻辑,我们称这种方式为Options API。缺点: 一个功能需要在不同的vue配置项中定义属性和方法,比较分散,项目小还好,清晰明了,但是项目大了后,一个methods中可能包含20多个方法,你往往分不清哪个方法对应着哪个功能,这个是深有体会在vue3 Composition API 中,我们的代码是根据逻辑功能来组织的,一个功能所定义的所有api会原创 2021-11-07 09:15:52 · 668 阅读 · 0 评论 -
Vue 在线演示编译结果
Vue 在线演示编译结果:Vue3: https://vue-next-template-explorer.netlify.app/Vue2: https://vue-template-explorer.netlify.app/原创 2021-11-07 09:07:39 · 608 阅读 · 0 评论 -
使用vite搭建vue3项目体验
Vite 需要 Node.js 版本 >= 12.0.0创建vite+vue3项目方法一:npm init @vitejs/app my-vue-app --template vue方法二:npm init @vitejs/app my-vue-app然后依次选择:vue->vue-ts 即可原创 2021-11-01 16:22:57 · 160 阅读 · 0 评论 -
VUE客户端调试chrome插件下载及安装说明
1、下载vuejs-devtools-4.1.5_beta.crx链接:https://pan.baidu.com/s/1WQAdTXRJTHXCiFBzcpBUxA提取码:1234复制这段内容后打开百度网盘手机App,操作更方便哦2、安装打开chrome://extensions/然后把下载的vuejs-devtools-4.1.5_beta.crx 拖进此界面即可。出现如上界面,说明安装成功!...原创 2020-12-08 14:59:02 · 236 阅读 · 0 评论 -
Vue 开源项目库汇总2020整理
文章目录UI组件开发框架实用库服务端辅助工具应用实例Demo示例UI组件element ★13489 - 饿了么出品的Vue2的web UI工具套件Vux ★8133 - 基于Vue和WeUI的组件库iview ★6634 - 基于 Vuejs 的开源 UI 组件库mint-ui ★6253 - Vue 2的移动UI元素muse-ui ★3705 - 三端样式一致的响应式 UI 库vue-material ★3328 - 通过Vue Material和Vue 2建立精美的app应用vueti原创 2020-10-13 16:41:34 · 1027 阅读 · 0 评论 -
vue脚手架学习笔记一
1. vue脚手架用来创建vue项目的工具包创建项目: npm install -g vue-cli vue init webpack VueDemo开发环境运行: cd VueDemo npm install npm run dev生产环境打包发布 npm run build npm install -g serve serve dist http://localhost:50002. eslint用来做项目编码规范检查原创 2020-08-15 17:11:27 · 402 阅读 · 0 评论 -
Vue2.x学习笔记:面试题整理,附带答案
面试vue原创 2020-04-22 10:54:46 · 740 阅读 · 0 评论 -
Vue2.x学习笔记:第3章-3:获取dom节点
文章目录1、方法12、方法21、方法1获取dom节点可以用ref属性,这个属性就是来获取dom对象的。看代码 这个属性就相当于给这个标签起了一个id样的东西<template> <div id="app" v-cloak> <input type="text" ref="userinfo" value="binge" /> <in...原创 2020-03-14 19:19:07 · 342 阅读 · 0 评论 -
Vue2.x学习笔记:第3章-2: 指令讲解
文章目录1、v-bind 指令1.1 v-bind用来绑定数据和属性以及表达式,缩写为':'2、v-model 指令2.1 绑定text2.2 绑定radio2.3 绑定checkbox2.4 绑定select3、{{}}和v-text指令、v-html3.1 表达式3.2 v-text指令绑定文本3.3 绑定html标签文本4、v-on 指令5、v-if 指令6、v-show 指令7、v-for...原创 2020-03-14 18:55:33 · 307 阅读 · 0 评论 -
Vue2.x学习笔记:第3章-1: data属性的三种写法及区别
文章目录1、三种写法代码2、区别1、三种写法代码方法一:var app = new Vue({ el: '#app', data: { message: 'Hello Vue!' }})方法二:export default { name: 'app', data: function(){ return { msg: "bin...原创 2020-03-14 15:30:07 · 450 阅读 · 0 评论 -
Vue2.x学习笔记:第2章 搭建Vue2.x开发环境的高级方式:基于Vue CLI 3.x的创建
文章目录1、版本区别2、旧版本的安装以及创建项目3、Vue CLI 3 版本的安装以及创建项目(推荐 )3.1 安装 Vue Cli3脚手架工具:官方命令行工具3.2 创建项目4 Vue CLI 3 图形化界面创建项目4.1 打开界面4.2 创建项目Vue CLI3 编译速度快,性能好,建议使用。1、版本区别关于 Vue CLI3 和 和 Vue CLI2 以及 Vue2.x Vue...原创 2020-03-14 11:42:11 · 150 阅读 · 0 评论 -
Vue2.x学习笔记:第1章 搭建开发环境的两种方式
文章目录1、第一种方式1.1 安装nodejs1.2. 安装vue的脚手架工具1.3. 创建项目1.4. 运行项目1、第一种方式先上提纲:必须要安装nodejs安装vue的脚手架工具创建项目运行项目1.1 安装nodejs请看这篇文章1.2. 安装vue的脚手架工具1.3. 创建项目1.4. 运行项目...原创 2020-03-14 10:18:23 · 362 阅读 · 0 评论 -
使用vue-cli(vue脚手架)快速搭建项目实例
文章目录1、使用npm创建项目1.1 全局安装 vue-cli1.2 创建项目1、使用npm创建项目下面整个过程是基于已经安装node.js和cnpm的基础上,node.js如何安装就不在这里详说了。怎么安装,查看这里1.1 全局安装 vue-cli在命令提示窗口执行cnpm install -g vue-cli 如下是安装成功界面:出现以上提示表示vue-cli正常安装成功,可...原创 2020-03-14 08:47:39 · 670 阅读 · 0 评论 -
Vue2.x学习笔记:第0章 初学NodeJS和npm
文章目录1、什么是nodejs?通俗讲解2、什么是npm?3、NodeJS和npm是什么关系呢?4、npm和cnpm是什么关系呢?5、安装nodejs(内嵌npm)6、试用npm及cnpm7、全局下载还是当前目录下载呢?1、什么是nodejs?通俗讲解node.js:是javascript的一种运行环境,是对Google V8引擎进行的封装。是一个服务器端的javascript的解释器。No...原创 2020-03-12 16:44:12 · 709 阅读 · 0 评论