vue
本专栏主要记录vue的基础知识
Java大憨
从事 Java开发、前端开发、基础设施运维、小程序开发等。
Talk is cheap,show me the code!|
展开
-
TypeError: xxx is not a function
一、问题描述: 1.在使用按钮监听一个事件的时候,出现了如下图的错误提示: 又是这个"xxx is not a function",这种错误还是会常见到的,经过一顿排查,最后发现是methods写成了method,改一下即可解决,当然也有可能是别的原因。。。这里我只是记录一下。...原创 2020-10-18 15:17:29 · 10017 阅读 · 3 评论 -
...mapGetters,mapGetters,...mapState,mapState的用法
一、简介 本文主要介绍...mapGetters,mapGetters,...mapState,mapState这个四个东西在vue中的用法。可能没有办法像大佬一样把所有用法都精彩的介绍给大家,但是基本用法一定给大家讲清楚。二、看代码 1....mapGetters和mapGetters: 这两个东西用在computed里面,常规的用法如下图所示: (1)首先是我的store/index.js: (2)接下来是.....原创 2020-09-28 16:30:10 · 20886 阅读 · 1 评论 -
WebStorm中使用Live Tempalte
最近在学Vue,其中使用到了Live Tempate,这里进行记录。Live Template意思就是我输入几个单词,然后再敲指定的按键,就会弹出一堆代码出来。当然我们必须事先定义好,什么样的单词能弹出什么样的代码。先在自己的html文件中定义好要弹出的代码,这些代码是常用的,而且比较多的。然后将这些代码复制到此处:Tempate text中。这里的各个用到的作用点图片已经说明了。所以最终效果就是我在html文件中敲 vue+enter键就可以弹出自定义的代码模板。...原创 2020-07-24 22:42:22 · 693 阅读 · 0 评论 -
vue-cli3的目录结构
一、简介 1. 本文主要介绍vue cli3创建的项目的目录结构。二、项目的目录结构 1. vue cli3和vue cli2有一些区别,但是区别不会很多,可以先去看看vue cli2创建项目的目录结构再来看这篇文章:vue cli2创建项目的目录结构。 2. public文件夹:该文件夹可以用来存放静态资源,存放在该文件夹的东西不会被打包影响,而是会原封不动的输出到dist文件夹中,和vue cli2中的static文件夹一样的。 ...原创 2020-08-06 23:10:40 · 3655 阅读 · 0 评论 -
vue-cli4.4.6的创建项目过程
一、简介 1.本文主要介绍vue cli3创建项目的过程二、具体过程 1. vue create 项目名称号 //创建项目 2. 请选择一个配置: (1) default (balel,eslint): 选择默认的配置,主要有babel和eslint还有一些基础配置。Manually select features手动选择哪些配置是想要的,如果是选择这个请看: ...原创 2020-08-06 22:04:08 · 620 阅读 · 0 评论 -
vue专栏说明
一、说明 1. vue专栏是我在学习王红元老师的vue.js课程的时候做的笔记,所有内容都是根据王红元老师课程讲诉我再自己总结归纳,然后有了这个专栏。 2. 这是王红元老师的github地址:coderwhy; 这是老师在b站的授课视频:vue.js课程; 3. 老师讲的这套vue.js加webpack课程是非常的清晰而且详细的,很多我们在学习vue的时候,我们都会问为什么这个点是这样,比如钩子函数是什么,比如vue的生命...原创 2020-08-06 20:26:41 · 274 阅读 · 0 评论 -
vue-cli2如何关闭Eslint
一、简介 1. 本文主要介绍Eslint的作用以及在vue的脚手架中如何安装和关闭Eslint。 2. Eslint是用来规范项目中的代码的,它会根据选定文档中定好的规约,以这些规约来检查我们写的代码是否符合,不符合就报错。 3. 安装Eslint,一般我们在用脚手架来创建项目的时候,会有一个选项是要不要使用Eslint,当我们选择yes之后,它会让我们再选择使用哪个文档作为规范代码的标准文档。 4. Eslint的效果:先运行...原创 2020-08-06 13:19:58 · 4014 阅读 · 0 评论 -
vue-cli2的目录结构解析
一、简介 1. 本文主要介绍vue cli2自动生成的项目结构的解析;二、项目结构 1. 上图是项目的整体目录结构。我们读这个项目结构的时侯要先从package.json开始读,首先是看package.json中的scripts中的build,可以看出来它是执行 node build/build.js, node是可以直接执行文件的。 所以我们去看看build.js。这里介绍一下,package.json...原创 2020-08-05 23:27:36 · 1781 阅读 · 1 评论 -
vue 优化组件开发
一、优化vue的组件化开发: 1.现在使用新建的.vue后缀的文件,这种类型的文件就是专门用于组件的,它的模板代码,js代码,css代码是分开的,而每个.vue文件又是一个完整的组件,而且在组件中又可以导入其他组件。 二、对后缀名为.vue的文件进行打包 1. 安装对应的loader: npm install vue-loader vue-template-compiler --save-dev; vue-loader...原创 2020-08-04 17:18:05 · 290 阅读 · 0 评论 -
el属性和template属性的关系
一、简介: 本篇文章主要介绍el属性和template属性的关系: 一句话来概括,当el和template同时出现的时候,template中的代码会替代el挂载的DOM元素。const app = new Vue({ el: '#app', data: { message: 'hello', name: 'lzc' }, template: ` <div> <h2...原创 2020-08-04 14:57:26 · 966 阅读 · 0 评论