VUE
关注
分享
扫一扫
巴啦啦小能量
前端开发
展开
-
loaders之val-loader
安装npm i -D val-loader加载的模块必须使用以下函数接口，将 default export 导出为一个函数。module.exports = function () {...};如果你有这样的模块answer.jsfunction answer () { return { code: 'module;' }};module.exports = a...原创 2019-02-21 14:09:07 · 5216 阅读 · 0 评论 -
[译] 尤雨溪：Vue 3.0 计划
Vue 2.0 恰好在两年前发布了（时间过得真快！）。在此期间，核心仍然向后兼容五个次要版本。我们已经积累了许多可以带来改进的想法，但一直没有发布它们（3.0），因为它们与现在的版本（2.x）相比，变化很大。与此同时，JavaScript生态系统和语言本身也在迅速发展。有了需要新的工具可以增强我们的工作流程，以及出现了许多新的语言功能，可以解决Vue试图解决的问题。并且有了使它变得更简单，更完整和...转载 2019-03-01 20:27:24 · 3981 阅读 · 0 评论 -
前端面试题（框架部分）
Vue：一、MVVM模式与MVC模式的区别MVVM即Model-View-ViewModel。它是将“数据模型数据双向绑定”的思想作为核心，因此在View和Model之间没有联系，通过ViewModel进行交互，而且Model和ViewModel之间的交互是双向的，因此视图的数据的变化会同时修改数据源，而数据源数据的变化也会立即反应到View上。Vue是以数据为驱动的，Vue自身将DOM和数...原创 2019-02-20 18:07:22 · 8006 阅读 · 0 评论 -
Vue的常用传值方式、父传子、子传父 非父子
父组件向子组件传值是利用props子组件中的注意事项：props:[‘greetMsg’]，注意props后面是[]数组可以接收多个值，不是{}。 且此处的greetMsg用greet-msg会报错，记住需用驼峰法命名非父子组件进行传值非父子组件之间传值，需要定义个公共的公共实例文件bus.js，作为中 间仓库来传值，不然路...原创 2019-02-21 11:08:38 · 4879 阅读 · 0 评论 -
Vue cli3 库模式搭建组件
市面上目前已有各种各样的UI组件库，比如 Element 和 iView，他们的强大毋庸置疑。但是我们面临的情况是需求越来越复杂，当它们不能再满足我们需求的时候，这个时候就有必要开发一套属于自己团队的组件库了。所以本文的目的就是让读者能通过此文，小能做一个简单的插件供人使用，大能架构和维护一个组件库不在话下。以下一个简单案例简述一下一、技术栈如何通过新版脚手架创建项目，这里就不提了，自行看...原创 2019-03-18 11:28:15 · 579 阅读 · 0 评论 -
Vue cli3 库模式搭建组件库并发布到 npm
三、规划目录结构1、创建项目在指定目录中使用命令创建一个默认的项目，或者根据自己需要自己选择。$ vue create .2、调整目录我们需要一个目录存放组件，一个目录存放示例，按照以下方式对目录进行改造。.…|-- examples // 原 src 目录，改成 examples 用作示例展示|-- packages // 新增 packages 用于编写存...原创 2019-03-18 11:33:41 · 13070 阅读 · 0 评论 -
vue难点理解以及搭建vue项目之购物车的数据模型
原创 2019-05-23 09:17:18 · 561 阅读 · 0 评论 -
vue 组件懒加载引入
非常简单components: {appview : resolve => require(["./components/AppView"],resolve)}原创 2019-05-23 14:44:31 · 2652 阅读 · 2 评论 -
Vue 2x 项目配置开发、测试、正式环境
Vue Cli 2.x构建的项目只有npm run dev和npm run build两条开发和编译的命令。而要添加测试环境，我们可以扩展一条npm run test的命令输出测试环境下执行的代码。1.在build文件夹中创建test.js文件test.js中的代码很简单，就两行。主要就是配置一个环境变量用以区别测试和正式环境。这里没有直接修改原有的process.env.NODE_ENV是担...原创 2019-05-28 09:57:57 · 843 阅读 · 1 评论 -
axios封装 之 vue
/** * Created by BruceLv on 2018/1/22. */import axios from 'axios'let base = 'http://192.168.1.112:3000/'axios.interceptors.request.use((config) => { return config}, (err) => { aler...原创 2019-05-24 10:29:02 · 232 阅读 · 0 评论 -
vue 解决办法 router的坑NavigationDuplicated {_name: "NavigationDuplicated", name: "NavigationDuplicated"
以上是错误信息 每次点一次都会报错只需要在routerjs里面写写上这个const originalPush = Router.prototype.pushRouter.prototype.push = function push(location) { return originalPush.call(this, location)}...原创 2019-09-26 14:12:43 · 268 阅读 · 0 评论 -
vue 前端项目技术选型、开发工具、周边生态
声明：这不是一篇介绍 Vue 基础知识的文章，需要熟悉 Vue 相关知识主架构： vue , vue-router , vuexUI 框架： element ui , iview , vuetify , vux , mint-ui , vue-material , muse-ui , vant , bootstrap-vue服务器端渲染： node.js开发工具： storybook , ...原创 2019-03-01 20:23:20 · 3813 阅读 · 0 评论 -
vuerouter的使用编程式导航和函数式导航
除了使用 创建 a 标签来定义导航链接，我们还可以借助 router 的实例方法，通过编写代码来实现。router.push(location, onComplete?, onAbort?)想要导航到不同的 URL，则使用 router.push 方法。这个方法会向 history 栈添加一个新的记录，所以，当用户点击浏览器后退按钮时，则回到之前的 URL。当你点击 时，这个方法会在内部...原创 2019-03-05 10:00:22 · 2069 阅读 · 0 评论 -
VUE传值图解
原创 2019-02-21 14:29:15 · 4185 阅读 · 0 评论 -
vue传值父子问题案例解决
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Title</title></head><body> <div i原创 2019-02-21 15:35:37 · 4350 阅读 · 0 评论 -
vue之swiper插件引入加载在模板混用
&lt;!DOCTYPE html&gt;&lt;html lang="en"&gt;&lt;head&gt; &lt;meta charset="UTF-8"&gt; &lt;title&gt;Title&lt;/title&原创 2019-02-22 08:36:58 · 4436 阅读 · 0 评论 -
vue开发购物车
文件目录资源请在博主资源内下载 vue开发购物车原创 2019-02-23 12:51:20 · 4810 阅读 · 0 评论 -
vue-router/router的配置和router-link的配合
router配置文件import Vue from 'vue'import Router from 'vue-router'import index from '@/pages/index'import fenlei from '@/pages/fenlei'Vue.use(Router)export default new Router({ mode : "history",...原创 2019-02-28 11:19:18 · 2939 阅读 · 0 评论 -
vue脚手架搭建vue-cli最新版
通过 @vue/cli 搭建交互式的项目脚手架。可以使用下列任一命令安装这个新的包：npm install -g @vue/cliORyarn global add @vue/cli安装之后，你就可以在命令行中访问 vue 命令。你可以通过简单运行 vue，看看是否展示出了一份所有可用命令的帮助信息，来验证它是否安装成功。你还可以用这个命令来检查其版本是否正确 (3.x)：vue...原创 2019-02-28 11:22:20 · 3382 阅读 · 0 评论 -
vue-cli构建项目imgsrc动态路径打包找不到路径资源
处理静态资源静态资源可以通过两种方式进行处理：在 JavaScript 被导入或在 template/CSS 中通过相对路径被引用。这类引用会被 webpack 处理。放置在 public 目录下或通过绝对路径被引用。这类资源将会直接被拷贝，而不会经过 webpack 的处理从相对路径导入当你在 JavaScript、CSS 或 *.vue 文件中使用相对路径 (必须以 . 开头) 引用...原创 2019-02-28 11:28:07 · 4218 阅读 · 1 评论 -
vue模板中对图片src的动态引入（路径）问题
在做移动端项目时，底部导航的名称和图片习惯于用json文件中引入数据。而在vue项目中，当要在中动态引入图片时，若直接从json文件中导入item.src字段为’assets/image/XX.png’的值到:src="XXX"中时，会出现图片404的情况。如:这么循环引入img图片，页面会报404，表明从指定的路径上去找是找不到图片的。如何解决呢？我们都知道，如果是import 或...原创 2019-03-01 09:46:43 · 14197 阅读 · 0 评论 -
vue子组件监听父组件的值同步更新数据
子组件props : [“data”],子组件监听 watch:{ data : (n ,o) => {//箭头函数 不然会发生this改变 console.log(n.img) this.imgs = n.img } }原创 2019-03-01 09:49:07 · 27488 阅读 · 0 评论 -
使用vue之vuex进行状态管理
首先学习vuex必须先知道vue原理Vue是一个典型的MVVM框架，模型（Model）只是普通的JavaScript对象，修改它则视图（View）会自动更新。这种设计让状态管理变得非常简单而直观Vue实现这种数据双向绑定的效果，需要三大模块：Observer：能够对数据对象的所有属性进行监听，如有变动可拿到最新值并通知订阅者Compile：对每个元素节点的指令进行扫描和解析，根据指令模板替...原创 2019-03-05 09:55:37 · 6038 阅读 · 0 评论 -
css设置滚动条 浏览器滚动条难看 调整滚动条 小主来j教你
::-webkit-scrollbar { width: 3px; height: 3px;}::-webkit-scrollbar-track { border-radius: 3px; /*滚动条的背景区域的圆角*/}::-webkit-scrollbar-thumb { border-radius: 3px; /*滚动条的圆角*/ background-colo...原创 2019-09-27 18:11:17 · 522 阅读 · 0 评论