TyrionJ的博客

安装快速搭建vue的webpack开发环境step 01yarn add tj-cli global// ornpm install tj-cli -gstep 02tj-cli create vue-jsx-demostep 03npm install @vue/babel-preset-jsx @vue/babel-helper-vue-jsx-merge-propsstep 04.babelrc配置{ "presets": [["env", { "mo

本文主要讲述vue中的异步组件，如果你看完本文相信你应该对vue中的异步组件有着相对深刻的理解，如果你还不知道vue中异步组件是什么，请参考vue异步组件为什么要异步组件异步组件是vue性能优化的一种方式，主要目的是为了解决页面引入很多组件导致打包后的js体积过大，我们知道同样条件下，文件体积越大，请求耗时越长，因此vue提供了异步组件，当页面中通过异步方式来声明（全局）或者注册（局部）组...

vue-blogdemo中只完成了注册，登录等页面，因为没有准备部署到服务器上，所以博客主体就不打算写了技术栈vuewebpack4vue-routervuexelementui源码react-blog基于react和antd搭建的个人博客技术栈reactreact-routerantd源码后台代码共用一份后台代码,后台使用koa写的技术栈koa...

注册在Vue中组件注册分为全局注册和局部注册全局注册Vue.component('my-component-name', { /* ... */ })组件名 'my-component-name'配置项 { /* ... */ }局部注册var ComponentA = { /* ... */ }var ComponentB = { /* ... */ }var Compo...

生命周期示意图我们看官网上vue实例的生命周期示意图示例代码// Lifecycle.vue<template> <div ref="app"> <button v-on:click="clear">销毁定时器</button> <span>{{count}}</span> ...

配置合并vue是一个学习成本很低的前端框架,开发者实际上只需要关注new Vue(options)中的配置即可，页面渲染，响应式数据的实现，vue 在背后做了大量的工作，本文主要分析vue实例以及组件实例的options配置是如何合并的。vue中定义了自己的默认配置,然后将用户的配置和默认配置进行合并，这种代码设计方式在我们日常开发中野会用到，比如封装基础的ajax请求，默认请求方式是POS...

本系列文章是作者在学习vue源码时的学习笔记，在学习的过程中会参考其他的文章，并在文末注明相关的引用。如有错误，欢迎指证。vue源码版本: vue@2.5.17-beta.0一. 类型校验vue使用了flow进行语法校验，其中vue自定义了一些数据类型比如component或者Element 等.flow是facebook出品的代码检查工具，功能类似于typeScript,能够帮助...

使用props和$emit进行组件间数据传递这是最常用的组件通信方式，适用于父子组件间数据传递父传子：子组件中props定义好要接受的数据，父组件中使用v-bind传递子组件props中定义好的数据。子传父: $emit(‘自定义事件名’，arguments),子组件中使用 $emit自定义事件及一个或多个参数，父组件中监听自定义事件并作相应业务处理使用$attrs和$listener...

学过Vue的都知道Vue等MVVM框架相对于传统的JS库比如Jquery最大的区别在于数据驱动视图，重点在于数据，拿到数据后将数据通过模板{{}}语法或者v-html展示在页面上。我们也都知道在Vue父子组件可以通过Props实现父组件传递到子组件。在项目开发中，我们会遇到这种需求，页面初始化时，父组件通过接口拿到需要数据，然后拿到的数据通过props传递给子组件。在子组件会有些业务上的操作来...

在vue中使用v-if来销毁组件近期项目中接手了一个同事用vue写的组件,说下项目的特点各种技术栈混合：jQuery, require.js, jquery, rivets.js最近的需求使用的框架是vue替代了之前的rivets.js数据渲染模板非模块化开发，使用es6模板字符串来写vue组件，一个js文件为一个vue组件项目主要做的工作是拿到后台数据渲染到页面上，对于动画等特效...

技术栈vuevuexvue-router（子路由）需求分析1）歌手列表点击歌手会跳转到下级页面歌手详情页，歌手详情页由四个部分组成歌手图片返回按钮：点击返回歌手tab页随机播放按钮歌手歌曲滚动 2）歌曲栏向上滚动到顶部时，图片和播放按钮随之隐藏，保留歌手名和返回按钮3）歌曲栏向下拖动时，歌手图片的高度作出无缝增高新的组件singer-detail.vuemusic-list.v

在项目开发中忽略了一个问题，导致数据不能传输报错。 App.vue 商品goods组件要传递需要的数据给购物车shopcart组件shopcart组件也定义了props来接受父组件goods传来的数据 为什么会报错呢，shopcart组件尽管定义了props来接受父组件的seller相关数据，goods组件也绑定了相关的seller相关的price数据但是这里忽略了重要的一点，goods组件是