zoukankan      html  css  js  c++  java
  • VUE-Day04 脚手架

    小总结:

    拿到项目

    先划分组件

    每个组件内包含几部分:①<template>模板 ②script ③样式   

                                            模板中放的就是HTML片段,之前所学习的绑定语法 

                                            script 主要是组件 ps: 只有new.Vue的data是写死的对象,其他的先写个function函数,然后return一个对象。computed watch 

    拿到部分界面,刨坑,将可能发生变化的位置内容、属性、样式都找到,这样就知道data里面写什么了,因为页面需要变得地方,下面都必须有值的支持。

    做每个组件时,要找到遥控的感觉,不要想着查找元素,要学会操作低下的数据控制页面的变化

    脚手架:

    什么是脚手架代码:半成品的项目源代码    (基本功能都已经有了,路由,new Vue 等,只需添加个性化定制的数据和界面)

    什么是脚手架命令行工具(CLI):反复创建脚手架源代码

    如何使用:①用 npm 安装脚手架命令行工具:

                         npm i -g @vue/cli

                      结构:可在命令行中使用vue命令反复创建Vue脚手架项目源代码

                      ②用Vue脚手架工具命令创建项目源代码:              

          default 默认

          vue create  项目名字

          Babel vuex router 

            use history mode 使用历史模式,可以去掉地址栏的#号

          分文件保存,还是一个文件保存

          In dedicated config files  //使用独立的配置文件保存每种工具的配置

          In package.json  // 配置保存在一个文件    

          Save this as a present for futere projects? //是否将此配置运用到将来所有项目的模板

          npm run serve //启动一个临时简版服务器,用于开发 live-server

          compiled 编译

    目录结构:

    public:所有不需要编译就可以直接使用的静态资源。

    src:组件,js,要写的都放这里。     ps:mount(加载)

    views:称得上页面的组件放在这里

    项目打开命令行

    npm run serve

    组件生命周期

    create:创建new Vue() 示例对象或组件对象。

    mount:扫描并生成虚拟DOM树,首次加载页面。

    update:当模型数据更新时,自动触发。

    destroy:当销毁组件对象时。

    duplicate 重复的

       

  • 相关阅读:
    配置高并发jdbc连接池
    java中的sleep()和wait()的区别
    程序员必知的8大排序(三)-------冒泡排序,快速排序(java实现)
    转HashMap Hashtable区别
    chrome 常用快捷操作
    sublime Text 常用操作
    flash 右键菜单隐藏与修改
    As3.0 视频缓冲、下载总结
    flash cs6 更新到Flash player15.0 及Air 更新方法
    As3.0 Interface 与类的使用
  • 原文地址:https://www.cnblogs.com/goforxiaobo/p/12683451.html
Copyright © 2011-2022 走看看