zoukankan      html  css  js  c++  java
  • vue笔记

    vue入门小记:

      全局安装npm install vue -g ,npm install vue-cli -g,

      初始化一个webpack脚手架vue init webpack {projectName},创建一个基于webpack的vue项目,(需要输入项目需要模块、描述等)

      进入项目,npm install安装缺少的依赖文件;

      npm run dev(脚手架提供的运行命令) 

      /***************************************************************************/

      npm run build 构建项目(生成项目文件在dist中)

      vue中的重要选项:

      data:所有vue组件数据的所在

      methods:定义的方法

        dosomething:function(){

          //方法体      

        }

      watch:监听某个对象的变化(类似于angular中的脏检查,实现方式不知道),object为被监听的data中的数据

        watch:{

          "object":function(val,oldValue){

            //方法内容

          }

        }

      指令:

        v-text,v-html,v-bind:class(绑定属性)

        v-if(boolean),v-else(必须跟在if之后,false执行)

        v-on:click(绑定时间)

        v-for 遍历(item in items)

      组件的划分:功能划分,页面区域划分

      父子间组件通信:

        1:父组件定义给子组件绑定属性,子组件props接收 .  props down

        2:子组件method中通过$emit(key,value)定义一个绑定事件,父组件中给子组件添加事件触发调用的函数. events up

      关于vue-cli webpack打包后css中背景图片路径出错问题

        :(vue-loader不能解析css中的路径)把图片以模板形式引入,data中添加'bacground: url ('+img path+') no-repeat', :style绑定到元素中

      兄弟组件通信:全局eventbus  、 vuex

        {eventsbus参考http://blog.csdn.net/u013034014/article/details/54574989?locationNum=2&fps=1}

      

    开黑吗我亚索贼6
  • 相关阅读:
    Redis
    双向绑定篇
    Vue篇1
    css篇-页面布局-三栏布局
    css篇-简化版
    Promise篇
    几道JS代码手写面试题
    安全篇
    Vue篇
    跨域篇--JSONP原理
  • 原文地址:https://www.cnblogs.com/insight0912/p/6900387.html
Copyright © 2011-2022 走看看