zoukankan      html  css  js  c++  java
  • vue基本语法概要(一)

    先看两种代码,再进行讲解

    第一种格式:

    <template >
      <div>
        <div v-for=" item in sites ">
          <li>{{item.name}}</li>
          <li>---------</li>
        </div>
      </div>
    </template>
    <script>
    export default {
      name: "v-if",
      data() {
        return {
          sites: [{ name: "goolge" }, { name: "baidu" }, { name: "cnlinfo" }]
        };
      }
    };
    </script>
    

     第二种格式:

    <div id="app">
              <li>{{mesg}}</li>
              <li>---------</li>
            </div>
        <script>
            var vm=new Vue({
                el:"#app",
                data:"跟我学vue"
            })
        </script>

    我们可以看到语法有多种方式,其中网上基础教程都是第二种,第一种呢,需要安装和配置才可以。具体配置请参考我第上一篇文章。
    下面我们讲一下里面的基本关键语法: 

    关键字 用途
    new Vue({}) 用于实例化的,学过c#等语言的会比较清楚
    el参数 DOM元素中的ID
    data 用于定义属性,或者值
    methods 故名思议就是函数或者c#的方法,这里我统称方法,毕竟做后端习惯了,不想改口了
    return 返回数据或终止方法逻辑运行
    {{}} 用来输出对象属性或方法返回的值
    export default {} 组建中常用的方式,会在组建中进行详解

    今天就先写这么多,都是比较基础的内容,难免有错误的地方也属正常,毕竟是搞程序,不是做学问,以实际运用为主。
    对于编程学习来讲,没有捷径可以走,只有不断的练习,从最简单的练习、学习、发现问题、解决问题,不要在乎那种语言是最好的语言。
    那不重要,我是这么认为的,重要的是你怎么运用自如!

  • 相关阅读:
    《极客时间--算法面试》--二叉树
    《极客时间--算法面试》-哈希表
    《极客时间-算法面试》-堆栈和队列
    《极客时间-算法面试》-数组和链表
    《极客时间-算法面试》
    《极客时间-算法面试》如何计算复杂度
    查找算法
    排序算法
    AI 期刊会议
    《剑指offer》数组中只出现一次的数字
  • 原文地址:https://www.cnblogs.com/c546170667/p/11285872.html
Copyright © 2011-2022 走看看