DevOps海洋的渔夫

在普通的js操作中，一般都是直接操作dom元素，但是对于Vue.js框架来说，一般是不允许直接操作dom元素的。 那么其实Vue.js框架提供了ref获取dom元素，以及组件引用。 从上面这里示例看出，ref虽然跟js都达到了获取dom元素的目的，好像没有什么出彩的地方，就好像…

为了更好看看父子组件之间的传值，本章来一个评论列表的小案例。 同时，需要写一个存储以及刷新评论信息列表的方法，在子组件提交评论信息之后，子组件还要调用父组件的这个刷新方法。 好了，看到上面几项的需求描述，下面来实现看看。 好了，现在基本页面已经写好了。但是为了演示父组件与子组件…

这就需要父组件传递事件方法，提供子组件调用，通过子组件调用父组件的函数，传入相关参数，来进行逆向传递。 而子组件如果想要调用父组件的函数，则需要使用emit方法。 父组件将方法的引用传递给子组件，其中，getMsg是父组件中methods中定义的方法名称，func是子组件调用传…

前面写了组件的创建、切换等等篇章，主要讲述了组件自身如何在父组件app中如何渲染使用。这里存在一个问题，就是父组件的数据如何传递到子组件中。 这是一个很常见的情况，如果是jQuery那么都是直接传参数就是了，而在Vue框架中，这里就要使用子组件中props属性来处理了。 那么下…

上一篇使用component元素实现组件切换，但是没有切换的动画效果。那么可以参考官网的例子，实现一下组件切换的动画，以及mode效果设置。 多个组件的过渡简单很多 - 我们不需要使用 key attribute。相反，我们只需要使用动态组件： 从上面官网的例子中，写这个组件切…

上一篇章使用v-if和v-else结合一个flag属性值来控制组件之间的切换。本章节使用components元素来更加直接的切换组件。 只需要绑定方法修改comName的值对应不同注册的组件名，就可以达到切换组件的效果。 也就是只要写一个方法来控制comName这个值，那么就可…

在登陆页面的需求中，一般都会有登陆、注册两个按钮，然后点击不同的按钮显示不同的页面。在这里对应的页面可以是一个组件。 那么通过点击不同的按钮，切换不同的组件页面。 下面使用v-if、v-else结合flag来实现这个页面的切换需求。 点击登陆或者注册，切换不同的组件。 那么看到…

前面写了组件的创建、切换等等篇章，主要讲述了组件自身如何在父组件app中如何渲染使用。这里存在一个问题，就是父组件的数据如何传递到子组件中。 这是一个很常见的情况，如果是jQuery那么都是直接传参数就是了，而在Vue框架中，这里就要使用子组件中props属性来处理了。 那么下…

上一篇使用component元素实现组件切换，但是没有切换的动画效果。那么可以参考官网的例子，实现一下组件切换的动画，以及mode效果设置。 多个组件的过渡简单很多 - 我们不需要使用 key attribute。相反，我们只需要使用动态组件： 从上面官网的例子中，写这个组件切…