vue
文章平均质量分 68
pardon110
这个作者很懒,什么都没留下…
展开
-
Vue实例
除了数据属性,Vue 实例还暴露了一些有用的实例属性与方法。它们都有前缀 $,以便与用户定义的属性区分开来。例如:var data = { a: 1 }var vm = new Vue({ el: '#example', data: data})vm.$data === data // => truevm.$el === document.getElementById('e...转载 2018-05-25 19:52:07 · 161 阅读 · 0 评论 -
Laravel-Mix工作流
序言wabpack的确强大但过于复杂,不易使用laravel-mix是轻量级的webpack,使之八成用例变得简单易用laravel-mix重写了webpack的默认配置,使之应用简单,可以用在任何项目简介laravel-mix优点ES2017 + 模块编辑- 创建并且编译 .vue 组件 (通过 vue-loader)- 模块热替换- Tree-shaking 打包...原创 2019-03-17 19:09:22 · 960 阅读 · 0 评论 -
laravel-mix API简录
Laravel-Mix概述属于webpack上层,使之八成用例变得易用编绘sass, 捆绑模块到指定模块跨平台 cross-env,laravel-mix可独立成派勿需强制与laravel一起生产环境文件自动压缩 export NODE_ENV=production webpack安装mix安装 npm init -y npm install larave...原创 2019-03-17 19:13:02 · 565 阅读 · 0 评论 -
webpack概述
概念组成基础:入点entry,出口output及模式mode附加: 规则module.rules,插件plugins五部分构成规则由test及loader构成,组loader以栈(先进后出)的形式进行管道流水模式development|production只设置 NODE_ENV,则不会自动设置 mode不同的取值,会设置process.env.NODE_ENV环境变量,从...原创 2019-03-29 14:28:04 · 106 阅读 · 0 评论 -
webpack实践指南(一)
webpack实践起步基本安装命令 mkdir webpack-demo && cd webpack-demo npm init -y npm install webpack webpack-cli --save-dev移除package.json中的main入口,确保private属性为私有<script> 标签之间存...原创 2019-03-30 17:19:41 · 129 阅读 · 0 评论 -
webpack实践指南(二)
代码分离达到的效果可以把代码分离到不同的bundle中,按需加载或并行加载,可控制资源加载优先级入口起点(entry points)使用entry配置手动地分离代码缺点不够灵活,并且不能将核心应用程序逻辑进行动态拆分代码如果入口 chunks 之间包含重复的模块,则模块会在bundle中被重复引用防止重复(prevent duplication)使用S...原创 2019-03-30 17:25:50 · 182 阅读 · 0 评论 -
Failed to resolve async component default: TypeError: __webpack_require__(...) is not a function
场景laravel5.7项目默认的laravel-mix编译异步路由,观察http异步组件加载成功,路由配置正确前端没有显示报错3个警告app.js:42886 [vue-router] Failed to resolve async component default: TypeError: Cannot read property ‘call’ of undefined...原创 2019-04-10 12:14:25 · 34640 阅读 · 0 评论 -
node-sass第三方下载,本地安装
问题前端同学,尤其是在windows平台上使用,使用npm会经常发现node-sass无法安装原因如下安装 node-sass 时在 node scripts/install 阶段会从 github.com 上下载一个 .node 文件。大部分安装不成功的原因都源自这里,因为 github Releases 里的文件都托管在 s3.amazonaws.com 上面,而这个网址在国内总是...原创 2019-04-01 12:02:39 · 6152 阅读 · 0 评论 -
vue vue-router vuex
vuexvuex数据存取流程用户调用一个action该action加载/计算数据该action提交一个mutationstate 被更新getter 将更新后的state返回给组件组件被更新vuex模块使用流程设置Vue组件,使用生命周期钩子,比如created方法分发加载动作actions,this.$store.dispatch将数据添加到组件,比如com...原创 2019-03-28 23:39:50 · 526 阅读 · 0 评论 -
数据结构 排序思想
数据结构,问题归约,目标,算子集数学模型准确性,可自动计算,过程与步骤用算法表示,算法描述与算法分析顺序,分支,重复流程结构回溯法,由后至前不停的试探-返回-再试探。比枚举法更先进,它缩小了解空间,也是一种穷举(部分穷举)。最优解,整体的所有解中最恰当的一个。数据类型表达数据本身,数据结构抽象:集合,线性,树形,图线性表 强调有序,即是一个序列。物理实现 链式存储与顺序存储...原创 2019-03-28 23:45:53 · 347 阅读 · 0 评论 -
报错解析 [Vue warn]: You may have an infinite update loop in a component render function.
vue操作一个很有意思的报错[Vue warn]: You may have an infinite update loop in a component render function. 组件代码结构:&amp;amp;amp;amp;amp;amp;lt;template&amp;amp;amp;amp;amp;amp;gt; &amp;amp;amp;amp;amp;amp;lt;span class=&a原创 2018-11-07 12:11:14 · 71955 阅读 · 8 评论 -
用http-server本地解决 to be served over an HTTP server
vue应用开发流程vue-cli构建项目骨架npm install安装依赖包npm run dev 开发调试代码npm run build生产环境代码问题执行第4步完成后,通常有如下小提示 Tip: built files are meant to be served over an HTTP server. Opening index.html over file:// ...原创 2018-10-06 12:15:47 · 3861 阅读 · 0 评论 -
v-mode组件之 Trix-editor
&amp;amp;amp;lt;template&amp;amp;amp;gt;&amp;amp;amp;lt;div&amp;amp;amp;gt; &amp;amp;amp;lt;!-- 此处hidden,id必须,id为trix-editor引用的input属性 --&amp;amp;amp;gt; &amp;amp;amp;lt;!-- 此处 name,value,hidden,原创 2018-07-06 11:20:41 · 673 阅读 · 0 评论 -
Node Sass could not find a binding for your current environment:
前端代码编译npm run dev报错如下 Node Sass could not find a binding for your current environment::Windows 64-bit with Node.js 4.x Found bindings for the following environment: 查阅相关资源,如此这般便可解决np...原创 2018-06-04 18:37:10 · 2204 阅读 · 0 评论 -
Expected indentation of 8 spaces but found 6
使用ESlint进行代码提示,经常报如下提示: ✘ http://eslint.org/docs/rules/key-spacing Missing space before value for key 'variables' src\components\Admin\LogIn.vue:45:19 variables:{ ^...原创 2018-05-28 20:51:55 · 16569 阅读 · 2 评论 -
refusing to merge unrelated histories
使用git合并两个不同项目时报如下错$ git pull https://gitee.com/pardon110/Laravel_Vue_GraphQL.git masterFrom https://gitee.com/pardon110/Laravel_Vue_GraphQL * branch master -> FETCH_HEADfatal: re...原创 2018-05-30 14:31:53 · 376 阅读 · 0 评论 -
Vue item_14 之slot详解
好的代码会说话,见&amp;lt;!DOCTYPE html&amp;gt;&amp;lt;html lang=&quot;en&quot;&amp;gt;&amp;lt;head&amp;gt; &amp;lt;meta charset=&quot;UTF-8&quot;&amp;gt; &原创 2018-06-22 11:42:10 · 587 阅读 · 0 评论 -
ES6 常识 Learn ES2015
在写vue用axios库时,发现有类似如下代码axios.get(`/${this.props.subreddit}.json`)查阅了相关资料,是ES6新特性,开此篇,以便后续收集备忘。 1. 反单引号 模板字符串 术语: Template Literals (模板对象) 语法: `${NAME}` 作用: :避免模板字符串拼接的不便。 备注:与bas...原创 2018-06-15 08:06:35 · 359 阅读 · 0 评论 -
Global Event Bus 使用vue.js创建全局事件总线
尽管有些关于事件总线/发布-订阅模式的报道不怎么好,但是在实现程序中相互无关联的部分之间的沟通方面这种模式是非常好的选择。下面我们一起来看一下Vue.js中强大的内建事件总线。创建事件总线(Event Bus)首先我们创建一个event bus然后export它,以便其他的模块和组件能够使用。//文件-&amp;gt;event-bus.jsimport Vue from 'v...转载 2018-06-18 09:11:29 · 2444 阅读 · 0 评论 -
Vue 修炼笔记之大白话
前期资源 1. [es5](https://old.babeljs.io/learn-es2015/) 2. webpack 3. js的原型继承,getter setter核心 每个vue组件都是一个vue实例。 模板文件转换成为 JavaScript 渲染函数。即vue的最终产出是js代码。响应原理 props下传数据,vue实例事件系统向上传递变化。...原创 2018-06-18 18:16:36 · 495 阅读 · 0 评论 -
Vue item_01 基础示例简介
所有内容代码驱动,注释作了必要说明。来于官网,出自己实践。<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width,原创 2018-06-19 10:48:29 · 4554 阅读 · 0 评论 -
Vue 之v-model 详解
自定义事件也可以用于创建支持 v-model 的自定义输入组件。记住:&amp;amp;amp;lt;input v-model=&amp;amp;quot;searchText&amp;amp;quot;&amp;amp;amp;gt;等价于:&amp;amp;amp;lt;input v-bind:value=&amp;amp;quot;searchText&amp;amp原创 2018-06-20 10:51:58 · 2741 阅读 · 0 评论 -
vue实现目录的curd
引用PascalCase (首字母大写命名)组件,<my-component-name> 和 <MyComponentName> 都是可接受直接在 DOM (即非字符串的模板) 中使用时只有 kebab-case是有效的,比如 text/x-template场景下,只能用后者知识点class 样式对象写法,CSS伪元素 ::before 用法vue 指令v-...原创 2019-07-03 08:49:37 · 565 阅读 · 0 评论