最近用vue在做一个项目，github用上找了一个日历插件，intall到了本项目中，配好以后发现插件的样式风格和项目总体风格相差较大，所以就像这个改一下插件风格，第一种方法：我直接在父组件中将style标签的scoped的属性去掉了，在父组件中直接写了想要的样式，重叠样式全部！important，结果确实生效了第二种方法：本想这个要是样式这么改，还有路可走；要是插件的底层方法呢，如果有对外开发的修改入口还行，要是没有，可咋办，于是...
过滤器 1.过滤器规则 Vue.js 允许你自定义过滤器，可被用于一些常见的文本格式化。过滤器可以用在两个地方： 双花括号插值{{}}和 v-bind 表达式 (后者从 2.1.0+ 开始支持)。过滤器应该被添加在 JavaScript 表达式的尾部，由“管道”符号指示： <!-- 在双花括号中 --> {{ name | Upper }} <!-- 在 `v-bind` 中 --> <div v-bind:id="martin | Upper"></div>过滤器分为全局过滤器和本地过滤器,全局过滤器顾名思义就是所有Vue实例挂载...
回忆在上一篇Vue响应式原理-理解Observer、Dep、Watcher简单讲解了Observer、Dep、Watcher三者的关系。在Observer的伪代码中我们模拟了如下代码:class Observer {constructor() {// 响应式绑定数据通过方法observe(this.data);} }export function observe (data) {const keys = Object.keys(data);for (let i = 0; i < keys.length; i++) {// 将data中我们定义的每个属性进行响应式绑定defineReactive(obj, keys[i]);} }export fun...
在vue1.x版本里是自带里几个基础的过滤器的（虽然不怎么用到）。 到了vue2.x版本之后，内置到几个过滤器就被删掉了，如果需要用到过滤器，就要开发者自己去定义。 可以把过滤器定义在某个组件内部，但这样就成了局部过滤器，在别的组件里是无法使用的。所以通常不会这么做。 也可以把过滤器写在main.js里。但如果项目中存在多个过滤器，这会使main.js文件看上去很庞大，不便于后期维护。 所以通常会新建一个js文件，专门用来存放所...
如果是简单实用vue的话，可以直接引用js文件。 https://vuejs.org/js/vue.js 但是在构建大型项目的时候推荐使用NPM安装，NPM能够很好的和诸如webpack或Browserify模块打包器配合使用，同时Vue也提供配套工具来开发单文件组件。 1. 安装nodejs 由于npm（nodejs package manager）是nodejs的包管理器，所以要首先安装nodejs，从官网下载相应版本安装即可https://nodejs.org/en/download/。 安装好后打开命令行工具，输入node就进入no...
Netlify 带有内置表单处理功能，可以用来存储表单数据，下载 csv 文件，同时可以在接收到新的提交时发送邮件通知或者通过配置 webhook 发送请求。 它是通过在部署应用时直接解析 HTML 文件，识别 html 中的 form 标签来实现的，本文记录如何在一个 Vue 应用中使用表单功能。 开发首先使用@vue/cli 新建一个 Vue 应用，完成一系列步骤后，运行应用 vue create my-awesome-app ... yarn serve创建一个 form 表单 <!--data-netlify="t...
之前开发项APP项目直接用APICloud+原生js的方式进行编写，整个项目下来发现开发慢，页面代码多且复杂，维护起来相对困难，而且文件大打包之后的APP会比较大，apicloud的框架也不好用，支持部分es67(像let、const、import等es6新特性不支持写的太难受了) 采用vue-cli+APIcloud的方式写解决以上痛点，开发灵活，并且打包之后体积更小速度更快 环境依赖 vuewebpackvue-cli3nodeJS基本流程 项目开发最好准备两个项目，一个打包APP，一...
写本篇文章之前其实也关注过vue中的一个关于加载动态组件is的API，最开始研究它只是用来实现一个tab切换的功能，使用起来也蛮不错的。 is 预期：string | Object (组件的选项对象) 用于动态组件且基于 DOM 内模板的限制来工作。 示例： <!-- 当 `currentView` 改变时，组件也跟着改变 --> <component v-bind:is="currentView"></component> 详见vue API中关于is的定义和用法 至于用在tab切换中，大概就是： <template><div><div>#动...
基于 iview Tabs 组件实现 功能：为每个 tab 动态创建不同的、特定的组件内容，而不需要大量的 import 组件并进行 component 注册 Index.vue<template><div class="content-left-menu"><div class="item-contain layout-content"><Tabs class="cmcc-ivu-tab2" type="card" closable><TabPane v-for="k in zj" :label="k.label" ><loader :vueName="k.vueName"></loader></TabPane></Tabs></div></div> </template> <script>import ...
1 前 言 1.1 CreateJS介绍 CreateJS是基于HTML5开发的一套模块化的库和工具。 基于这些库，可以非常快捷地开发出基于HTML5的游戏、动画和交互应用。 A suite of modular libraries and tools which work together or independently to enable rich interactive content on open web technologies via HTML5. 包含4类工具库 EaselJSTweenJSSoundJSPreloadJS1.2 CreateJS版本 1.2.1 GitHub 地址： https://github.com/CreateJS 以 ...
Cli3工具中，配置路径别名最近用Vue Cli3脚手架搭建了Vue项目，发现没有build目录了，里面的webpack相关的也没了，看了官方文档后，查了资料后，发现都在vue.config.js里来配置了配置路径别名，方便引用，不用写那么长 配置前: import TodoList from ../../components/TodoList配置后(不用再关心文件层级关系): import TodoList from components/TodoList在根目录下添加vue.config.js,添加如下代码： const path = require(path) f...
之前找了不少如何开发谷歌插件的文章，结果发现都是些很基础的内容，并没有写到如何快速编译打包插件。我就在想为什么不能通过webpack来打包插件呢？如果通过webpack编译的话，就能使开发过程变得更舒服，使文件结构趋向模块化，并且打包的时候直接编译压缩代码。后来发现了 vue-cli-plugin-chrome-ext 插件，通过这个插件能很方便地用 vue-cli3 来开发谷歌插件，并能直接引用各种UI框架跟npm插件。 tip：如果你没接触过谷歌插件开...
前言 vue-cli3推崇零配置，其图形化项目管理也很高大上。 但是vue-cli3推崇零配置的话，导致了跟之前vue-cli2的配置方式都不一样了。 别名设置，sourcemap控制，输入文件位置和输出文件位置和输出的方式，压缩js控制，打包webapck日志分析，externals忽略配置（外部引入），调试的端口配置，proxy接口配置等等的。 有时候还需要我们配置的，因为官方推荐的，并不适用于我们平时的开发所用的。 所以，我的vue.config.js配置是下面这...
一、概念 1. $on("事件名称"，回调函数) 事件绑定，一个事件名称上面可能绑定多个函数 2. $emit("事件名称"，需要传递的值) 事件触发时，会触发当前事件身上所有的函数 3. $off("事件名称"，[需要解绑的函数]) 事件解绑时，若指定解绑函数则只解绑相应函数，否则解绑全部 二、手动封装on，emit，off事件在vue中的作用 | 在vue中进行非父子组件传值时，我们可以通过在vue的原型上添加一个公共的vue实例，组件之间调用这个公共实例的...
前言 本文主要介绍属性、事件和插槽这三个vue基础概念、使用方法及其容易被忽略的一些重要细节。如果你阅读别人写的组件，也可以从这三个部分展开，它们可以帮助你快速了解一个组件的所有功能。本文的代码请猛戳 github博客 ，纸上得来终觉浅，大家动手多敲敲代码！ 一、属性 1.自定义属性props prop 定义了这个组件有哪些可配置的属性，组件的核心功能也都是它来确定的。写通用组件时，props 最好用对象的写法，这样可以针对每个...