vue
关注
分享
扫一扫
hahalang-
前端攻城狮一枚
展开
-
三分钟学会Vue自定义插件-----实现一个alert/confirm插件
使用Vue开发的过程中，我们会在很多地方用到一些同样的功能，比如说提示弹窗，这种时候我们可以自定义一个插件，方便在多个地方使用。项目目录结构：modules：放置模块的文件夹，里面有一个 alert 文件夹，用于存放 alert 插件 ； Alert.vue：就是我们要在多处用到提示弹窗组件； index.js：对于该自定义插件的一些配置；代码编写：Alert.vue<template> <!-- 初始状态下隐藏提示框 --> <div v.原创 2020-05-10 15:17:13 · 3393 阅读 · 6 评论 -
vue-cli3.0 执行打包指令npm run build后如何本地直接访问index.html
1：在最外层目录下创建一个vue.config.js文件；2. 在vue.config.js中输入如下代码：module.exports = { publicPath: './'}3. 保存后执行npm run build以后会出现一个dist目录，点击里面的index.html文件即可直接访问本次项目，而不需要执行npm run serve。注意： 不配置vue.co...原创 2019-05-01 13:09:28 · 11192 阅读 · 1 评论 -
解决vue项目运行过程中，npm run dev 报错问题
错误：ERR! code ELIFECYCLEnpm ERR! errno 1npm ERR! metools@1.0.0 dev: `node build/dev-server.js`npm ERR! Exit status 1npm ERR!npm ERR! Failed at the metools@1.0.0 dev script.npm ERR! This is pro...转载 2019-04-01 18:32:01 · 2030 阅读 · 0 评论 -
vue-cli3.0如何在本地模拟JSON数据
找了半天以后发现说的都比较模糊，最后找到下面这篇文章清晰明了，成功的实现了。参考该文章即可：https://www.cnblogs.com/beevesnoodles/p/10026751.html原创 2019-03-31 12:22:18 · 3102 阅读 · 0 评论 -
vue项目如何通过电脑连接手机热点在手机上访问
首先当然得让电脑连上手机热点，使他们处于同一个局域网中； 去命令行工具输入ipconfig获取电脑的ip，如下图所示IPv4地址就是本机电脑的IP 3. 接着去vue项目中修改配置项，步骤如下：去congif目录下的index.js文件 将里面的host设置为本机ip即可。最后修改完成以后重启服务器：npm run dev即可。...原创 2019-03-12 09:46:13 · 1616 阅读 · 0 评论 -
一.初识vue
首先，根据两个实例来比较原生js和vue.js的区别：1.给dom元素添加内容：原生js的写法：<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Document</title><原创 2018-05-01 11:43:57 · 334 阅读 · 0 评论 -
二.Vue基础
1. v-on:click='handBtn' 可以这么简写 @click='handBtn'。v-bind:href='url' 可以这么缩写 :href='url' {{item}}这种叫插值表达式。2.每个组件也是vue的实例3.生命周期函数就是vue实例在某一个时间点会自动执行的函数，vue的生命周期函数并不放在methods里，而是单独放在Vue实例...原创 2018-05-11 22:23:29 · 1556 阅读 · 0 评论 -
三、 深入理解Vue组件
一.使用组件的细节点。1.table 里面使用组件时要注意，由于h5规定table的tbody下必须放<tr></tr>标签，但是我们在使用组件的时候标签名用的是自定义的<row></row>，这就导致了下图的现象。代码：<body> <div id="root"> <table> ...原创 2018-05-16 18:12:10 · 918 阅读 · 0 评论 -
四、vue中的动画特效
一.vue中的css动画原理：通过在某一时刻自动的往一些标签上增加一些样式来实现的。看下面代码：<body> <div id="root"> <div v-if='show'>hello world</div> <button @click='handClick'>切换</button>原创 2018-05-17 10:37:04 · 5308 阅读 · 0 评论 -
vue项目报警告：error： Expected linebreaks to be ‘LF’ but found ‘CRLF
原因是：这就是eslint的报错了，可能是原作者用的事linux系统，而我们是用windows 下的bash解决方案：项目根目录下有.eslintrc.js文件，在配置文件中修改rule配置项，如下：'linebreak-style': 'off' ...原创 2019-01-02 10:09:18 · 1437 阅读 · 2 评论 -
一个vue页面使用多个components
第一步：在compoents目录下创建多个组件； 第二步：在App.vue中添加多个router-view标签，别忘了写name； 第三步：修改router目录下的index.js文件； ...原创 2019-01-07 11:06:31 · 17117 阅读 · 0 评论