vue主题的文章列表，还有vue的技术要点_第1页

vue项目中使用v-if判断数组长度length报错

Error in render: "TypeError:Cannotreadproperty'length'ofundefined"解决方法：shopListData.attrs!==undefined&&shopListData.att...

开发笔记·2022-05-23

vue深度监听对象

watch:{picker:{//为对象名handler(){//对象内数据变化会执行此方法document.getElementById('nowColor').style.color=this.picker.color},deep:true//深度监听申明字段}} ...

开发笔记·2022-05-19

Vue过滤器的使用

<!DOCTYPEhtml><html><head><metacharset="utf-8"><title>vue过滤器</title></head><body><divid='app'><h1>{{...

开发笔记·2022-05-11

jQuery和Vue操作select示例

jQuery操作select示例<divid="example"><selectid="select1"></select><pid="p1">Result:</p></div><script>$(document).ready(fun...

开发笔记·2022-04-22

vue导航条怎样去掉#

VUE默认是hash浏览模式，换成history可以去掉#exportdefaultnewRouter({mode:'history',routes:[]}） ...

开发笔记·2021-04-26

Vue（5）- axios、vuex

一、内容回顾1、webpack（前端中工作，项目上线之前对整个前端项目优化）　　-entry：整个项目的程序入口（main.js或index.js）；　　-output：输出的出口；　　-loader：加载器，对es6代码的解析，babel-loader（官网：https://www.babeljs.cn/）是浏览器支...

代码星球·2021-02-25

Vue（4）- 获取原生的DOM的方式、DIY脚手架、vue-cli的使用

一、获取原生的DOM的方式　　在js中，我们可以通过id、class或者标签获取DOM元素，vue中也为我们提供了获取原生DOM的方法，就是给标签或者组件添加ref属性，通过this.$refs获取，如下：<divid="app"></div><scriptsrc="https://cdn...

代码星球·2021-02-25

Vue（3）- 安装脚手架、过滤器、生命周期的钩子函数、vue-router基本使用

一、安装脚手架1、下载node.js，本文下载版本为node-v8.12.0-x64.msi，一键式安装。2、安装完成后，打开终端，输入node，可进入node环境（两次ctrl+c退出），如下图：3、查看版本，如下图：4、在成功安装node.js（即能够成功查看版本如上图）的前提下，再安装淘宝npm（http://n...

代码星球·2021-02-25

Vue（2）- v-model、局部组件和全局组件、父子组件传值、平行组件传值

一、表单输入绑定（v-model指令）　　可以用v-model指令在表单<input>、<textarea>及<select>元素上创建双向数据绑定。　　详细用法参见官方文档：https://cn.vuejs.org/v2/guide/forms.html二、局部组件和全局组件1、了...

代码星球·2021-02-25

Vue（1）- es6的语法、vue的基本语法、vue应用示例，vue基础语法

一、es6的语法1、let与var的区别　　ES6新增了let命令，用来声明变量。它的用法类似于var（ES5），但是所声明的变量，只在let命令所在的代码块内有效。如下代码：{　　leta=10;　　varb=1;}a//ReferenceError:aisnotdefined.b//1　　上面代码在代码块之中，分别...

代码星球·2021-02-25

在vue-cli生成的项目中使用karma+chrome进行单元测试

用vue-cli生成项目时，如果选择了单元测试，那么会采用karma+mocha作为单元测试框架，默认使用的浏览器是PhantomJs。 Karma是一个基于Node.js的JavaScript测试执行过程管理工具（TestRunner）。可启动所有主流Web浏览器作为测试容器，运行时会启动一个web服务器，...

代码星球·2021-02-25

在vue-cli搭建的项目中在后台mock接口中支持req.body和req.cookies

在《vue-cli搭建的项目中增加后台mock接口》中实现了后台mock，但是前端post的t数据都要在mock的后台接口中使用req的接收数据事件获取http协议body中的数据。req.on('data',function(chunk){//接收字节数据});req.end('data',function(){//...

代码星球·2021-02-25

在vue-cli搭建的项目中增加后台mock接口

用vue-cli搭建一个前端开发环境确实是极其方便，在写前端代码肯定也是少不了需要调用后台提供的业务接口进行前后端交互，特别在敏捷开发中，前后端都要提前确定业务接口并进行打桩，在开发过程中基本是没有现成的后台可以调用，基本上都是自己写mock进行模拟。在vue-cli搭建的项目中，框架上用的是express的web框架...

代码星球·2021-02-25

vue-cli+webpack在生成的项目中使用bootstrap方法（二）

vue-cli+webpack在生成的项目中使用bootstrap方法（一）中，是通过手动下载bootstrap库，然后手动添加到src/assets中，显然是过程太多。当然是可以更省力些，可以通过npm安装bootstrap，然后用import直接导入bootstrap的方式进行整合，因为vue-loader能自动从...

代码星球·2021-02-25

vue-cli+webpack在生成的项目中使用bootstrap方法（一）

在一个html页面中加入bootstrap是很方便，就是一般的将css和js文件通过Link和Script标签就行。那么在一个用vue-vli生成的前端项目中如何加入？因为框架不一样了，略微要适应一下。脚手架生成项目执行命令用webpack模板生成一个名为vuestrap的项目（名字任意）vueinitwe...

代码星球·2021-02-25