Vue
林飞的梦呓
日拱一码,功不唐捐!
展开
-
全局数据设置provide/inject
// src / App.vue<template> <div id="app"> <router-view/> </div></template><script>import { getToken } from './utils/auth'export default { name: 'App', provide() { return { globalDb: this原创 2020-10-08 22:59:39 · 530 阅读 · 0 评论 -
vue全局组件的封装
// src/components/GButton/index.vue<template> <div> <el-button icon="el-icon-plus" type="success" @click="add">添加</el-button> <el-button icon="el-icon-edit" type="success" @click="edit">编辑</el-button> <原创 2020-10-08 22:59:58 · 439 阅读 · 0 评论 -
Element-ui按钮统一设置为同一尺寸
// main.jsimport Vue from 'vue'import locale from 'element-ui/lib/locale/lang/zh-CN' // lang i18n...Vue.use(ElementUI, { locale, size: 'small' })原创 2020-09-27 21:54:10 · 2975 阅读 · 0 评论 -
vue拖拽自定义指令完善
拖拽边界问题:两种情况:拖拽的盒子宽高小于可视区宽高(网上常见都默认考虑这一种,其实还有第二种情况如下)拖拽的盒子宽高大于可视区宽高export default { bind(el, binding, vnode) { const dialogHeaderEl = el.querySelector('.el-dialog__header') const dragDom = el.querySelector('.el-dialog') dialogHeaderEl.st原创 2020-09-27 21:46:04 · 197 阅读 · 0 评论 -
vue-cli 3.0在创建项目时无法选择配置
vue-cli 3.0在创建项目时无法选择配置问题:上下箭头无法切换选择Manually select features解决方案:通过winpty vue.cmd create wap这个命令创建项目使用powershell原创 2020-06-06 11:14:03 · 925 阅读 · 0 评论 -
[vue-router] Named Route 'activePublic' has a default child route.
vue-router.esm.js?fe87:16 [vue-router] Named Route 'activePublic' has a default child route. When navigating to this named route (:to="{name: 'activePublic'"), the default child route will not be ...原创 2018-06-22 16:31:31 · 720 阅读 · 0 评论 -
Component template should contain exactly one root element. If you are using v-if on multiple elemen
写着写着发现报错了,犯了个低级错误!谨记! Component template should contain exactly one root element. If you are using v-if on multiple elements, use v-else-if to chain them instead. 修改后: ...原创 2018-06-04 19:29:14 · 529 阅读 · 0 评论 -
TypeError: Cannot read property '$createElement' of undefined
使用vue-router,在main.js中import组件,初始化后报错: Failed to resolve async component render: TypeError: Cannot read property ‘$createElement’ of undefined原创 2018-06-04 19:19:13 · 5786 阅读 · 1 评论 -
vuejs中父子组件之间通信
vuejs中父子组件之间通信一、父组件向子组件传递消息// Parent.vue&amp;amp;lt;template&amp;amp;gt; &amp;amp;lt;div class=&amp;quot;parent&amp;quot;&amp;amp;gt; &amp;amp;lt;v-child :msg=&amp;quot;message&a原创 2018-07-12 21:18:15 · 5834 阅读 · 0 评论 -
{ parser: "babylon" } is deprecated; we now treat it as { parser: "babel" }
{ parser: “babylon” } is deprecated; we now treat it as { parser: “babel” }// 项目目录\node_modules\vue-loader\lib\template-compiler\index.js{ parser: "babylon" }改成 { parser: "babel" } // prettify ...原创 2019-07-09 11:52:30 · 1167 阅读 · 0 评论 -
axios使用
axios demo示例&amp;amp;amp;amp;lt;!DOCTYPE html&amp;amp;amp;amp;gt;&amp;amp;amp;amp;lt;html lang=&amp;amp;amp;quot;en&amp;amp;amp;quot;&amp;amp;amp;amp;gt;&amp;amp;amp;amp;lt;head&amp;amp;am原创 2018-05-16 17:01:54 · 525 阅读 · 0 评论 -
如何在vue项目中引入elementUI组件
一、初始化项目$ vue init webpack vue-elementui$ npm run dev二、安装 elementUI$ npm i element-ui -S三、引入elementUI在main.js中引入elementUIimport ElementUI from 'element-ui'import 'element-ui/lib/theme-chalk/index.css'原创 2018-03-02 01:30:43 · 22556 阅读 · 0 评论 -
[vue-router] Named Route 'Home' has a default child route.
[vue-router] Named Route 'Home' has a default child route. When navigating to this named route (:to="{name: 'Home'"), the default child route will not be rendered. Remove the name from this route and u原创 2018-03-12 09:54:29 · 11541 阅读 · 3 评论 -
npm WARN deprecated babel-preset-es2017@6.24.1: ???? Thanks for using Babel: we recommend using ba
$ npm installnpm WARN deprecated babel-preset-latest@6.24.1: We're super ???? excited that you're trying to use ES2017+ syntax, but instead of making ...原创 2018-05-01 02:41:24 · 10597 阅读 · 0 评论 -
avoid using JavaScript unary operator as property name: "delete(index)" in expression @click="delete
avoid using JavaScript unary operator as property name: “delete(index)” in expression @click=”delete(index)”原创 2018-04-28 01:47:02 · 4069 阅读 · 3 评论 -
Vue中src属性绑定的问题
一、Vue中src属性绑定的问题图片src属性未绑定的时候,相对路径为"../assets/product.png",可以看到图片会在浏览器中渲染出来, 当以src属性绑定的时候 :src="{{ item.pro_img }}",浏览器报错。 productList: [ { ... // 'pro_img': '.....原创 2018-04-25 17:36:22 · 30114 阅读 · 0 评论 -
Vue统计总价
Vue项目目录结构 先上一张自己布局后的图片吧! 自己截的图片 先布局 Cart.vue<template><div class="hello"> <h1 class="product-title tc">购物清单</h1> <div class="product-box tc"&原创 2018-04-25 17:18:08 · 1830 阅读 · 0 评论 -
vue-cli的build的文件夹下没有dev-server.js文件,如何配置本地数据
vue-cli的build的文件夹下没有dev-server.js文件,怎么配置本地数据因为最新版本的vue-cli已经放弃dev-server.js,只需在webpack.dev.conf.js配置就行新版webpack.dev.conf.js配置如下: 上面一张图是初始稿,只写引入本地数据那一条代码即可, 如下图: 需要安装express依赖 npm install e...原创 2018-04-21 01:30:52 · 1564 阅读 · 1 评论 -
Vue中img的src属性绑定
在vue的开发中遇到这样一个问题: img的src属性绑定url变量,然而图片加载失败。 大部分的情况中,是开发者使用了错误的写法,例如:<img src="{{ imgUrl }}"/>这样写肯定是不对的,正确的写法应该使用v-bind:<img v-bind:src="imgUrl"/>原创 2018-04-21 01:07:52 · 49398 阅读 · 4 评论 -
Vue实现的简单选项卡
App.vue<template> <div id="app"> <Tab/> </div></template><script>import Tab from './components/Tab'export default { name: 'App', components: { Tab }}</script><style> ul, li {原创 2018-04-25 05:04:30 · 23587 阅读 · 6 评论 -
"export 'users' was not found in './data.js'
data.js mock.js "export 'users' was not found in './data.js'两种解决方案: 1.把data.js末尾的 export default { users } 改为export { users } 2.删掉data.js末尾的 export default { users }, 然后在开头的const users前面加上 export原创 2018-04-20 18:25:37 · 33123 阅读 · 0 评论 -
Vue打包后出现一些map文件
问题: 可能很多人在做vue项目打包,打包之后js中,会自动生成一些map文件,怎么把它去掉不要呢? 运行 cnpm run build 开始打包后会在项目目录下自动创建dist目录,打包好的文件都在其中 解决办法:去src/config/index.js中改一个参数: productionSourceMap:false 把这个改为false。不然在最终打包的文件中会出现一些map文件map转载 2018-04-20 00:55:06 · 3789 阅读 · 0 评论