bower(前端包管理器) npm install bower -g bower install bower uninstall bower info vue bower install vue#1.0.28 - 动画 (进入 出去)
- <div id="div1" class="animated" v-show="bSign" transition="bounce">
- new Vue({
- el:'',
- data:{
- bSign=true;
- },
- methods:{
- toggle(){
- this.bSign=!this.bSign
- }
- },
- transitions:{ //定义所有动画名称
- bounce:{
- enterClass:'zoomInLeft', //这里用的就是animate.CSS中定义的动画样式
- leaveClass:'zoonOutRight'
- }
- }
- })
Vue 组件 组件就是一个大对象
全局组件
- <div id="#box">
- <aaa></aaa>
- <div>
- var Aaa=Vue.extend({
- data(){
- return {
- msg:'标题'
- }
- },
- methods:{
- change(){
- alert(123);
- }
- }
- template:"<h1 @click="change">{{msg}}</h1>"
- });
- Vue.component('aaa',Ass); //全局组件
- var vm=new Vue({
- el:'#box',
- data:{
- }
- })
局部组件
- <div id="#box">
- <aaa></aaa>
- <div>
- var Aaa=Vue.extend({
- data(){
- return {
- msg:'标题'
- }
- },
- methods:{
- change(){
- alert(123);
- }
- }
- template:"<h1 @click="change">{{msg}}</h1>"
- });
- var vm=new Vue({
- el:'#box',
- data:{
- },
- components:{ //局部组件
- aaa:Aaa
- }
- })
来源: http://www.2cto.com/kf/201706/647709.html