<!DOCTYPE HTML>

<html lang="en-US">

<head>

    <meta charset="UTF-8">

    <title></title>

    <script src="https://cdn.jsdelivr.net/npm/vue"></script>

</head>

<body>

    <div id="app">

        <ul>

            <li v-for="item in tabs">

                {{ item.text }}

            </li>

        </ul>

    </div>

    <script type="text/javascript">

        new Vue({

            el:'#app',

            data: {

                tabs: [{

                    text:'巴士'

                },{

                    text:'快车'

                },{

                    text:'专车'

                },{

                    text:'顺风车'

                },{

                    text:'出租车'

                },{

                    text:'代驾'

                }]

            }

        })

    </script>

</body>

</html>

vue文件中挂在一个实例

vue简单实例代码的更多相关文章

  1. vue - 简单实例(vue-router + webpack + vuex)

    分享 + 实践  基于公司部分产品技术栈转型使用vue,部分同事需要学习一下,快速上手,那么我很荣幸的成为了给大家分享vue技术栈的‘ ’导师‘,在这里我分享一下: 讲解大纲为:(我是有一份PPT的, ...

  2. html5+go+websocket简单实例代码

    这次的就直接发放代码截图吧,应该是用go语言做后台一个简易的聊天,这里没用到什么特别的知识,最朴实的来实现效果,主要目的是分享下h5怎么用websocket,go搭建websocket服务的主要部分. ...

  3. .net自定义事件，经典简单实例代码

    1,新建一个控制台应用程序TestDelegate,本项目主要实现:热水器加热,报警器监控,当热水温度达到80度的时候报警器报警这样一个简单的事件处理程序 2,定义委托处理程序 public dele ...

  4. Vue 简单实用---代码可以直接用

    <!DOCTYPE html> <html> <head> <title></title> <script src="htt ...

  5. KVC/KVO简单实例代码

    Person.h #import<Foundation/Foundation.h> @classAccount; @interfacePerson :NSObject{ @private ...

  6. mysqli数据库操作简单实例

    mysqli数据库操作简单实例 代码 结果

  7. vue.js+webpack在一个简单实例中的使用过程demo

    这里主要记录vue.js+webpack在一个简单实例中的使用过程 说明:本次搭建基于Win 7平台 Node.js 安装官网提供了支持多种平台的的LTS版本下载,我们根据需要来进行下载安装.对于Wi ...

  8. vue.js最最最最简单实例

    vue.js最最最最简单实例 一.总结 一句话总结: 1.vue.js实现实现数据的双向绑定用的是什么标记? 双大括号:比如{{message}} 2.vue数据循环输出的标记是什么? 用的是标签的v ...

  9. Vue简单基础 + 实例 及 组件通信

    vue的双向绑定原理:Object.defineProperty() vue实现数据双向绑定主要是:采用数据劫持结合发布者-订阅者模式的方式,通过 Object.defineProperty() 来劫 ...

随机推荐

  1. 固定div的位置——不随窗口大小改变为改变位置

    百度首页示例: 我给二维码,和下面文本固定位置 这时html代码 <div id="bar_code"> <div class="img_put&quo ...

  2. 使用Spark进行搜狗日志分析实例——map join的使用

    map join相对reduce join来说,可以减少在shuff阶段的网络传输,从而提高效率,所以大表与小表关联时,尽量将小表数据先用广播变量导入内存,后面各个executor都可以直接使用 pa ...

  3. dom编程艺术笔记2--第三章

    DOM 1.dom:简单理解为文档对象模型<==>节点树 2.宿主对象:浏览器提供的对象—>document对象 3. html标签为树顶点元素 head body为html子元素以 ...

  4. Mybatis Generator主要配置详解

    MyBatis 的代码生成主要配置文档[具体] <?xml version="1.0" encoding="UTF-8"?> <!DOCTYP ...

  5. Sublime使用及配置C编译器

    一.环境配置 在安装了MinGW+Gcc的基础上做如下设置—— 新建编译系统c.sublime-build: { "cmd" : ["gcc", "$ ...

  6. Can DBC 文件翻译，不是很标准，凑合看还可以

    1 引言 DBC文件描述单个CAN网络的通信.这个信息足以监测和分析网络并模拟不是物理可用的节点(剩余的总线模拟). DBC文件也可以用来开发电子控制单元的通信软件,该控制单元应该是CAN网络的一部分 ...

  7. 网页中，鼠标点击与javascript的click事件怎么区分处理

    就下面问题发现另一个方式: js代码: <script> //IE if(document.all) { document.getElementById("clickme&quo ...

  8. http协议发送post请求

    package post; import java.io.BufferedReader; import java.io.IOException; import java.io.InputStreamR ...

  9. js中的正则

    闭包: 函数在调用的时候会形成私有的作用域,对内部的变量起到保护的作用,这就是闭包: 变量销毁: 1.人为销毁 : var a = 12:   a = null: 2.孜然销毁 : 函数在调用完之后, ...

  10. matlab批量读取一个文件夹里类似命名的mat文件

    参考网址: Matlab读取同一路径下多个txt或mat文件总结 matlab 批量读取数据文件.mat .dat 整理:matlab批量读入数据文件的方法 首先命名方式体现在只是名字里数字有变化,其 ...