Vue2.X前端学习笔记

Vue3 核心功能的第一次尝鲜经历

与vue2.x的区别以及个人观感vue3
全栈修炼·2020-07-09 14:57

vue2.X心得

VUEJS学习网址：https://cn.vuejs.org/此文章是用来记录自己的学习和实践心得。关注点：父子组件之间的通信看图说话：PassProps子组件本身与父组件是孤立的，通过子组件中显示声明的props属性，接收父组件数据;父组件的数据更新时，子组件的prop会跟着更新；此数据流动是单向的（看着）;EmitEvents子组件使用$.emit(fn)向外抛出自己的内部触发的事件;父组件是
aisi1982·2020-07-09 13:11

前端学习笔记Part1-2：JS性能优化、GC算法介绍和V8引擎

JavaScript性能优化JavaScript内存管理内存管理介绍内存：有可读写单元组成，表示一片可操作的空间管理：人为的去操作一片空间的申请、使用和释放内存管理：开发者主动申请空间、使用空间、释放空间流程管理：申请–使用–释放JavaScript申请内存空间、使用内存空间、释放内存空间//申请letobj={}//使用obj.name='lg'//释放obj=nullJavaScript中的垃
PingerLearnWeb·2020-07-09 11:03

vue2.x和vue3的数据响应式原理

那么都快要使用3了，vue2.x和vue3的数据响应式原理有什么差异？我单独分析一个点。
三木雪白水·2020-07-09 10:46

前端学习笔记--CSS实现单行、多行文本溢出显示省略号

实现单行文本溢出overflow:hidden;text-overflow:ellipsis;white-space:nowrap;效果如图：实现多行文本溢出display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:3;overflow:hidden;效果如图：-webkit-line-clamp用来限制在一个块元素显示的
沧澈·2020-07-09 10:21

Vue3体验卡～

2.x，但是众所周知在今年的上半年，至少作者是这么说的所以很多东西也都还没确定百分百是这样的，很有可能有改动，这个到时候再说本章讲的内容基本都是根据Vue官方RFC来写的，因为这里面的消息还相对可信与vue2
你脑子里的铁线虫·2020-07-09 08:09

vue2.x与vue1.0一些插值和指令的比较

1.单次插值v1中单次插值语法{{*数据}}，v2不能使用v2使用v-once指令{{msg}}{{*msg}}-->{{msg}}varapp=newVue({el:"#myapp",data:{rawHTML:'thisshouldbered.',msg:"xixi"},methods:{pclick:function(){this.msg="haha"}}})2.html插值v1中过滤htm
落崖惊风yxy·2020-07-09 04:13

2019web前端学习笔记——js高级（3）

二、RegExp对象:什么是:保存一条正则表达式，并包含用正则表达式执行验证和查找功能的对象何时:只要在js中使用正则表达式，都要先创建正则表达式对象，再使用正则。如何:1.创建正则表达式对象:2种:（1）创建一个固定的正则表达式对象:varreg=/正则/ig问题://之间不允许写js语句动态生成正则表达式（2）正则表达式需要动态生成varreg=newRegExp("正则","ig")说明:因
xiaoyuzhouxyj·2020-07-09 01:14

2019web前端学习笔记——js高级（1）

day01主要内容正则表达式String中的正则API:一、正则表达式:二、String中的正则表达式:1.查找敏感词:4种:（1）查找一个固定的敏感词出现的位置vari=str.indexOf("敏感词",starti)在str中，从starti位置开始，找下一个敏感词出现的位置返回值:如果找到，返回敏感词第一个字的下标如果没找到，返回-1问题:只能查找一个固定的敏感词，不支持正则！（2）模糊查
xiaoyuzhouxyj·2020-07-09 01:14

前端学习笔记

1.外部引用脚本切不能包含2.JavaScript对大小写敏感。但对空格不敏感3.关于代码中拆行您可以在文本字符串中使用反斜杠对代码行进行换行下面例子正确：document.write("Hello\World!");下面例子错误：document.write\("HelloWorld!");4.如果重新声明JavaScript变量，该变量的值不会丢失;5.如果需要在定义时规定类型，可以使用关键词
小小小骆驼·2020-07-09 01:21

vue v-for循环数据列表，点击获取循环列表当前项的某一项的数据，例如id

前言本文为vue2.x语法，3.0语法从以下链接进入另一篇文章。
好巧.·2020-07-08 21:41

前端学习笔记——JavaScript

一、JavaScript基础1.JavaScript介绍JavaScript是互联网上最流行的脚本语言，可用于Web和HTML，也可广泛用于服务器、PC端、移动端。JavaScript脚本语言：  JavaScript是一种轻量级的编程语言  JavaScript是可插入HTML页面的编程代码  JavaScript插入HTML页面后，可由所有的浏览器执行2.JavaScript实现用法：  HT
一的一的一·2020-07-08 20:35

[原生 js 训练计划] 禁止复制粘贴

欢迎大家加入我的github项目,一起学习，一起发展--->全栈工程师进阶学习站--->我的前端学习笔记--->行业内最新最群的报告，工作日每日更新—>原生js训练计划禁止复制粘贴禁止复制粘贴window.onload
Gavincoder·2020-07-08 19:00

vue中获取当前点击标签的value值

欢迎大家加入我的github项目,一起学习，一起发展--->全栈工程师进阶学习站--->我的前端学习笔记--->行业内最新最群的报告，工作日每日更新—>原生js训练计划打印自身的valuejs代码部分print02
Gavincoder·2020-07-08 19:00

java面试题(2019)_____看完涨薪2K+______必刷面试题

欢迎大家加入我的github项目,一起学习，一起发展--->全栈工程师进阶学习站--->我的前端学习笔记--->行业内最新最群的报告，工作日每日更新—>原生js训练计划2019–JAVA新征程github
Gavincoder·2020-07-08 19:00

视频教程-Vue 2.x全家桶(vue-cli3,vuex,vue-router,axios)-Vue

Vue2.x全家桶(vue-cli3,vuex,vue-router,axios)多年软件开发、互联网架构与项目管理经验，丰富的大型Web系统架构和开发经验，资深Web前端工程师。
weixin_34462777·2020-07-08 18:24

前端学习笔记 - nuxt.js

最近工作中有用到服务端渲染，一边学一边写了一个小demo，这里记录下过程：服务端渲染的好处就不多说了，网上有很多，直接开始吧！使用create-nuxt-app官网按照官网的教程第一步：yarncreatenuxt-app我的项目名也叫nuxt-app所以我输入的命令是：yarncreatenuxt-appnuxt-app选择项目配置输入完上面的命令后会有一些选项：需要注意的是chooserend
weixin_34318956·2020-07-08 17:22

Vue2.x踩坑与总结

年前就打算学习并总结一下vue2.x，但是因为年前工作比较多，所以进展十分缓慢，现在终于学了一大部分，而且自己在学习开发中也踩了不少坑也总结了不少，所以将自己踩过的坑总结一下分享出来。
weixin_34245749·2020-07-08 17:26

vue2.X 自定义 模态框 modal

1.自定义modalModal.vue起床吃饭集合加工车间取消确定exportdefault{props:{show:{type:Boolean,default:false}},data(){return{value:false}},mounted(){this.value=this.show;},//监听show数值的变化watch:{show:{handler:function(val,old
weixin_33877885·2020-07-08 16:16

Web前端学习笔记学习路线图

随着互联网的快速发展，web前端行业发展前景较好，虽然web前端薪资高入门门槛低，但是俗话说的好：入门容易，精通难。web前端开发的知识点繁多，所以，要想真正全部掌握web前端工程师开发技能，并非一件易事，而且，网上的视频，不系统，知识前后不连贯，所以想真正的掌握web前端开发技术，灵活的运用到企业项目，还需要你能真正的接触到一些企业级的项目，懂得前后台交互，然而，这所需要时间就是不可估量的了，想
weixin_30822451·2020-07-08 14:42

Vue2.0配置postcss-px2rem

1、安装node（自带npm包管理工具）2、安装vue2.x脚手架：npminstallvue-cli-g，控制台输入vuelist查看是否安装成功3、创建项目：vueinitwebpackmy-project4
小理有趣·2020-07-08 11:24

我的前端学习笔记8—css选择器

任性配图，内容无关1，CSS选择器常见的有几种?基础选择器（id选择器#id{}、class选择器.class{}、通用副选择器#{}、标签选择器p{}）组合选择器（组合选择器）属性选择器（属性选择器）伪类选择器（：hover、：active等）伪元素选择器（:before、:after、:first-line）2，选择器的优先级是怎样的?优先级从先到后排列依次为：在属性后面使用!importan
HARRISKING·2020-07-08 10:44

富文本编辑器TinyMCE在vue2.x中的使用以及动态绑定(解决双向绑定后光标跳到最左侧问题)

写在前面项目重构老管理后台，使用vue作为前端框架，对于一直使用jsp+jquery开发管理后台的我还是挺头疼的…之后在vue官网学习了一下基础知识外加向前端同事讨教，粗略了解了vue的使用，如果文中有错误地方请多多包涵。由于不是专业的前端开发，所以并没有使用vue-cli脚手架，只是用的原生vue。下面是最终效果图：引入vue和tinyMCEtinyMCE下载地址:https://www.tin
颤抖吧腿子·2020-07-08 07:35

Web前端学习笔记——Ajax

1.概述Web程序最初的目的就是将信息（数据）放到公共的服务器，让所有网络用户都可以通过浏览器访问。在此之前，我们可以通过以下几种方式让浏览器发出对服务端的请求，获得服务端的数据：地址栏输入地址，回车，刷新特定元素的href或src属性表单提交这些方案都是我们无法通过或者很难通过代码的方式进行编程（对服务端发出请求并且接受服务端返回的响应），如果我们可以通过JavaScript直接发送网络请求，那
唯恋殊雨·2020-07-08 07:11

Web前端学习笔记——JavaScript之对象

对象为什么要有对象functionprintPerson(name,age,sex....){}//函数的参数如果特别多的话，可以使用对象简化functionprintPerson(person){console.log(person.name);……}什么是对象现实生活中：万物皆对象，对象是一个具体的事物，一个具体的事物就会有行为和特征。举例：一部车，一个手机车是一类事物，门口停的那辆车才是对象
唯恋殊雨·2020-07-08 07:11

Web前端学习笔记——JavaScript之数组、函数、作用域

数组为什么要学习数组之前学习的数据类型，只能存储一个值(比如：Number/String。我们想存储班级中所有学生的姓名，此时该如何存储？数组的概念所谓数组，就是将多个元素（通常是同一类型）按一定顺序排列放到一个集合中，那么这个集合我们就称之为数组。数组的定义数组是一个有序的列表，可以在数组中存放任意的数据，并且数组的长度可以动态的调整。通过数组字面量创建数组//创建一个空数组vararr1=[]
唯恋殊雨·2020-07-08 07:11

web前端学习笔记——Day7

六、JavaScript的循环与异常try{//这段代码从上往下运行，其中任何一个语句可抛出异常改代码块就结束运行}catch(e){//如果try代码块中抛出了异常，catch代码块中的代码就会被执行。//e是一个局部变量，用来指向error对象或者其他抛出的对象}finally{//无论try代码是否有异常抛出（甚至是try代码块中有return语句，finally代码块中始终会被执行）}注意
小小鱼@✔·2020-07-08 02:59

web前端学习笔记——Day11

六、动画效果6.1显示隐藏hideshowtoggle三个函数方法显示隐藏hello隐藏显示切换$(document).ready(function(){$("#hide").click(function(){$("p").hide(1000);});$("#show").click(function(){$("p").show(1000);});//用于切换被选元素的hide()与show()方
小小鱼@✔·2020-07-08 02:28

web前端学习笔记——Day3(css)

css：层叠样式表，用来控制网页数据的表现，可以使用网页的表现与数据内容分离一、css的四种引入方式1、行内式行内式是在标记的style属性中设定css样式。hello2、嵌入式嵌入式是将css样式集中写在网页的head标签对的style标签对中。格式如下：Titlep{background-color:"red";}a{text-decoration:none;//去掉下划线}helloworl
小小鱼@✔·2020-07-08 02:27

web前端学习笔记——Day5

七、css的float属性（最重要）先来了解一下block元素和inline元素在文档流中的排列方式。block元素通常被实现为独立的一块，独占一行，多个block元素会各自新起一行，默认block元素宽度自动填满其父元素宽度。block元素可以设置width、height、margin、padding属性；inline元素不会独占一行，多个相邻的行内元素会排在同一行里，直到一行排列不下，才会新换
小小鱼@✔·2020-07-08 02:27

web前端学习笔记——Day2

六、表单标签form表单用于向服务器传输数据。表单能够包含input元素；比如文本字段、复选框、单选框、提交按钮等。表单还可以包含textarea、select、fieldset和label元素。1、表单属性HTML表单用于接收不同类型的用户输入，用户提交表单时1向服务器传输数据，从而实现用户与web服务器的交互。表单标签，要提交的所有内容都应该在该标签中。action：表单提交到哪？一般指向服务
小小鱼@✔·2020-07-08 02:27

web前端学习笔记——Day9(jQuery)

一、jQuery是什么？jQuery由美国人JohnResig创建，至今已吸引了来自世界各地的众多javascript高手加入其team。jQuery是继prototype之后又一个优秀的Javascript框架。其宗旨是——WRITELESS,DOMORE!它是轻量级的js库(压缩后只有21k)，这是其它的js库所不及的，它兼容CSS3，还兼容各种浏览器jQuery是一个快速的，简洁的javaS
小小鱼@✔·2020-07-08 02:27

web前端学习笔记——Day4

五、css的常用属性1、颜色属性1、color:red;直接颜色的英文2、color:#ffee33;十六进制表示3、color:rgb(255,0,0);rgb三原色表示，取值0~2554、color:rgba(255,0,0,0.5);a表示透明度2、字体属性1、font-size:50px/50%/larger(大小)2、font-family:'lucidaBright'（字体）3、fon
小小鱼@✔·2020-07-08 02:27

web前端学习笔记——Day10

四、操作元素（属性，css，文档处理）4.1属性操作--------------------------属性$("").attr();//拿到属性对应的值$("").removeAttr();//$("").prop();$("").removeProp();如果是固有的属性，就用prop，如果是自己定义的属性，就用attr--------------------------CSS类$("").a
小小鱼@✔·2020-07-08 02:27

前端学习笔记-8.16.nuxt.js安装

nuxt.js是服务端框架。流程图：IncomingRequest输入请求|nuxtServerInit新建定义nuxtServerstoreaction存储动作|middleware|asyncData(异步数据)&fetch(获取？)Pages&children|Render传递------------------------------->安装运行create-nuxt-app用脚手架工具c
我就是小强·2020-07-08 02:59

Vue2.x -Axios请求，拦截器

不得不说不管是微信小程序还是Web，封装的请求使用起来确实很方便，起码能让代码看起来清晰，不那么冗余，不过最重要还是能少写几行代码。哈哈1.创建Vue模板项目：进入项目下，npminstallaxios2.打开项目进入min.js,将他们挂载到全局中，方便使用。importAxiosfrom'axios'Vue.prototype.$Axios=Axios3.components文件夹下，创建一个
一个头发贼多的小火鸡·2020-07-08 02:12

前端学习笔记（带实例）

前端学习笔记实例:图片自动轮换varindex=0;functionchangeImg(){//1.获得要切换图片的那个元素varimg=document.getElementById("img1");
热爱编程，热爱生活·2020-07-07 23:11

vue2.X基础速成---核心技术（3）

认识vue-cli快速创建工程的两种方法（vuecreate命令，ui界面）方法1vuecreatehello-world配置组件方法2：vueui把这个地址粘贴到浏览器地址栏勾选”使用配置文件“上面勾选的就会在各个配置文件中工程化项目的目录结构（组件目录、package.json）组件化思想什么是组件化？独立的可复用的整体化的为什么组件化？实现功能模块的复用高执行效率开发单页面复杂应用如何拆分？
时光猎人688·2020-07-07 23:33

前端学习笔记-html-图像标签img&绝对/相对路径

图像标签img(重点)单词缩写：image图像HTML网页中任何元素的实现都要依靠HTML标签，要想在网页中显示图像就需要使用图像标签，接下来将详细介绍图像标签以及和他相关的属性。其基本语法格式如下：该语法中src属性用于指定图像文件的路径和文件名，他是img标签的必需属性。src用来设置图片文件所在的地址，这一路径可以是相对路径，也可以是绝对路径。练习：图片标签插入图片的基本方式：imgsrc=
Nanami Touko·2020-07-07 23:44

vue核心技术知识点总结

很多场景下，大公司更青睐于React技术栈，而随着Vue2.x的发布更新，很多公司开始选用vue作为主要技术栈。vue上手成本低，且社区多为中文，对于开发者而言要求相对较低。
qdmoment·2020-07-07 19:49

vue2.x +webpack4.x+Hbuilder单页面打包成apk

vue2.x+webpack4.x写的项目，现在用hbuilder打包成apk，主要有几点注意的：cnmprunbuild的时候，更改一下config下的index.js中assetsPublicPath:‘/‘为’./’，把压缩的true改成false:更改router中的mode为hash模式，或者注释掉history：把vue项目打包：cnmprunbuild，得到dist文件。然后安装hb
行走的鱼儿·2020-07-07 14:35

Vue 开发必须知道的 36 个技巧【近1W字】

后面应该还会有Alpha、Beta等版本,预计至少要等到2020年第一季度才有可能发布3.0正式版;所以应该趁还没出来加紧打好Vue2.x的基础;Vue基本用法很容易上手,但是有很多优化的写法你就不一定知道了
出来打我略略略·2020-07-07 13:31

我的前端学习笔记12——负边距与三栏布局

“就赌我会死，反正你逢赌必输嘛哈哈”1，负边距在让元素产生偏移时和position:relative有什么区别?负边距：边距是元素本身的一部分，不是移动。并且负边距会影响文档流的整体变化，其后的元素会跟着一起移动。position:relative是不脱离文档流的情况下（元素原有空间不会被挤占），让元素针对自身位置进行移动。2，使用负margin形成三栏布局有什么条件?元素在同一个父容器内并且同方
HARRISKING·2020-07-07 13:57

搭建vue3.x脚手架

继上次写搭建vue2.x脚手架还没过多久，3.x就发布了，怀着心中一万只土拨鼠呐喊着学不动的心情写下这篇博客，简单记录一下vue3.x的脚手架搭建1.https://cli.vuejs.org/zh/guide
helloFE·2020-07-07 09:02

vue2.x自定义组件上使用v-model指令

我们都知道v-model是双向数据绑定经常用到的指令，今天学习到在组件上使用v-model指令，感觉还挺不错的，分享一下总数{{total}}Vue.component('my-component',{template:'+1',data:function(){return{counter:0}},methods:{handleClick:function(){this.counter++;thi
FLTmiao·2020-07-07 07:42

Vue-Cli4.x项目通过electron打包桌面应用程序

发现网上的教程大部分都是vue2.x目录结构不太一样还有就是将一些问题整合在一起傻瓜式教程步骤一下载electron的demo项目electornGitHub下载demoelectron-quick-start
丢糖的小孩Una·2020-07-06 20:33

web前端学习笔记——Day6(js)

一、JavaScript的引入方式{#1直接编写alert("hello")}{#2导入js文件}一般情况下习惯于放在和之间，这样不会存在当要找标签时，script找不到标签的问题。二、JavaScript的基础2.1、变量在JavaScript中，变量是弱类型的（很随便）。1、声明变量时不用声明变量类型，全部使用var关键字。vara；2、一行可以声明多个变量，并且可以是不同类型。varname
小小鱼@✔·2020-07-06 18:03

web前端学习笔记——Day8

十五、js的history对象和location对象1、History对象History对象属性History对象包括用户（在浏览器窗口中）访问过的URL。History对象是window对象的一部分，可通过window.history属性对其进行访问length返回浏览器历史列表中的URL数量。History对象方法back()加载history列表中的前一个URL。forword()加载his
小小鱼@✔·2020-07-06 18:03

web前端学习笔记——Day1(html)

heda标签metameat标签的组成：meat标签共有两个属性，它们分别是http—equiv属性和name属性，不同的属性又有不同的参数值，这些不同的参数值就实现了不同的网页功能。1、name属性主要用于描述网页，与之对应的属性值为content，content中的内容主要是便于搜索引擎机器人查找信息和分类信息用的。keywords：关键字content后面跟的是关键字。通过关键字搜索找到关键
小小鱼@✔·2020-07-06 18:00

vue2.X基础知识二之数据计算

1、filters过滤前端在展示后端传递过来的数据时，往往不能直接显示出来，需要经过一些转换，比如后端有个字段是datetime格式的，到了前端会发现是一个很奇怪的字符串，这个时候，通常需要写一个函数来格式化一下，在vue中，我们可以使用filter来增加一个函数用于格式化输出；这里我们以输入人民币，自动转换为美元为需求。例子如下：今日美元兑换人民币的汇率为：{{rate}}我要换美元请输入金额(
啊哈！前端·2020-07-06 08:44
上一页 31 32 33 34 35 36 37 38 下一页
按字母分类： ABCDEFGHIJKLMNOPQRSTUVWXYZ其他