reaaal的博客

scoped的作用功能组件的私有化，不对全局造成样式污染，表示当前style属性只属于当前模块。虽然方便但是我们需要慎用，因为当我们使用公共组件时会造成很多困难，增加难度，想知道造成哪些难度，需要先从scoped实现原理了解。scoped实现原理通过观察DOM结构可以发现：vue通过在DOM结构以及css样式上家伙是哪个唯一的标记，确保唯一，达到样式私有化，不污染全局的作用，像下图所示，样式属性上也会多一个该字符，确保唯一。可以看出，家伙是哪个scoped后的组件里的便签都会多一个data-v-

eventBus对于非父子组件的传值，如果不是项目很大很复杂，使用eventBus方法来实现传值。这种方法通过一个空的Vue实例作为中央事件中心，用他来触发事件和监听事件。具体步骤如下：新建一个Vue实例。比如新建一个Bus文件夹。下面是index.js。在需要进行传值的页面读引入这个Bus文件夹。import Vue from 'vue'export default new Vue在需要传值的页面（组件）内通过$emit来触发一个自定义事件。Bus.$emit("getCourse"

因为vue组件是可复用的。一个组件被创建好之后就有可能在各个地方被引用。而不管组件被复用了多少次，组件中的data数据都应该是相互隔离、互不影响的。如果不用函数，用的是对象形式，那么每个组件的data都是内存在同一个地址当中，如果其中一个数据改变了其他的也会跟着改变。只有在函数作用域中，每个data里面的数据都会拥有自己的作用域，每个实例也就是相互独立的，不会相互影响。...

hash中所周知，vue-router存在两种模式，hash模式和history模式。那么两者的区别主要在哪里呢？hash模式的工作原理是hashchange事件，可以在window监听hash的变化。我们在url后面随便添加一个#xx触发这个事件。window.onhashchange = function(event){ console.log(event.oldURL,event.newURL); let hash = location.hash.slice(1); do

Vue实现数据双向绑定主要是：采用数据劫持结合发布者-订阅者模式的方法，通过**Object.defineProperty()**来劫持各个属性的setter和getter，在数据变动时发布消息给订阅者，触发相应监听回调。当把一个普通JavaScript对象传给vue实例来作为他的data选项时，vue将遍历它的属性，用Object.defineProperty()将它们转为getter和setter。用户看不到getter和setter，但是在内部它们让Vue追踪依赖，在属性被访问和修改时通知变化。.

他们俩都属于一架构，或者说是一个架构模式。MVC模式MVC：也就是model-view-controller，即模型-视图-控制器。C也指页面的业务逻辑。使用MVC的目的就是将M和V的代码分离。MVC是单向通信，也就是View和Model，必须通过Controller来承上启下。MVVMMVVM模式是由MVC演变过来的。为什么会有MVVM框架的出现？在过去的10年中，我们已经把很多传统的服务器端代码放到了浏览器，这样就产生了成千上万行的JavaScript代码，它们连接了各种各样的HTML和C

全局安装vue-cli 电脑全局搜索cmd，以管理员身份运行 npm install -g cnpm --registry=https://registry.npm.taobao.org cnpm install -g vue-cli 全局安装成功，可通过 vue -V 命令检查 此时，如果执行vue ui命令没有跳转到浏览器，就说明安装的vue-cl...

在创建路由实例的时候，通常会隐藏掉一个模式mode，默认为hash。也就是网页地址上会带一个#。在#后面做路由的变化，页面是不会刷新的。constrouter=newVueRouter({//mode:'hash',//这是默认的，在创建路由实例时是没有的routes})当我们将项目布到正式环境上时，会不希望在url中看到“#”，这时就...

https://router.vuejs.org/zh/guide/advanced/navigation-guards.html实际项目中常用。在路由发生跳转到导航结束这一段时间内做相应的逻辑处理。（也就是每当进行路由跳转时，需要预先进行一些判断，这是就需要导航守卫）。比如登录验证（未登录去登录页）。##全局守卫前置：按顺序调用。const router = ne...

vue注册组件可以使用大写，例如标准的驼峰式命名。但是在调用组件的时候，需要在驼峰命名的大写字母间加上“-”并改写为小写。例如 注册组件 myTemplate ，在调用时，需要写成 <my-template />官网上这样说：HTML特性是不区分大小写的。所以，当使用的不是字符串模板，camelCased（驼峰式）命名的prop需要转换为相对应的kebab-case（短横线隔开式）...