<!DOCTYPE html>

<html>

<head>

    <meta charset="utf-8">

    <title>

    </title>

</head>

<body>

    <div id ="app">

        <h2>{{title}}</h2>

    <div class="box">{{content}}</div>

    <!-- v-*:指令系统 -->

    <button v-on：click ="bian">变</button>

</div>

    <script type="text/javascript" src="vue.js"></script>

    <script type="text/javascript">

            //数据驱动视图

            var options ={

                    el: "#app",

                    data:{

                        title :"我是一个h2标题",

                        content:" 嘿嘿嘿"

                    },

                methods:{

                    bian:function(){

                        this.title="该了"

                    }

                }

            };

            var app= new Vue(options);

            console.log(app.title)

    </script>

</body>

</html>

day 97 VUE第一天的更多相关文章

  1. 小白学习VUE第一篇文章---如何看懂网上搜索到的VUE代码或文章---使用VUE的三种模式：

    小白学习VUE第一篇文章---如何看懂网上搜索到的VUE代码或文章---使用VUE的三种模式: 直接引用VUE; 将vue.js下载到本地后本目录下使用; 安装Node环境下使用; ant-desig ...

  2. 总结Vue第一天：简单介绍、基本常用知识、辅助函数

    总结Vue第一天:简单介绍.基本常用知识.辅助函数 中文官网:https://cn.vuejs.org/v2/guide/syntax.html 遇到不熟悉的可以先看一下官网,然后再看一下一些别人写的 ...

  3. Vue第一个自定义组件：数字输入框(number-input)

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  4. 18课 Vue第一节

    Q1: url-loader必须搭载file-loader?Q2: 图片的打包问题,如果直接写在img标签里用src引用图片,该如何打包?Q3: 如何根据不同的页面html模板打包与之对应的css/j ...

  5. 01 (H5*) Vue第一天

    目录 1:什么是Vue.js 2:MVC和MVVM. 3:为什么要学习前段框架 4:框架和库的区别 5:怎么使用Vue. 6:常见的Vue指令 7:  五大事件修饰符 8:在vue中使用class样式 ...

  6. Vue第一天

    什么是 Vue.js? Vue.js是前端的主流框架之一,与 Angular.js.React.js一起,并称为前端三大主流框架 Vue.js是一套构建用户界面的框架,只关注视图层,它不仅易上手,还便 ...

  7. vue第一篇（搭建vue开发环境）

    1.下载node并安装 下载地址: https://nodejs.org/zh-cn/ 下载后双击文件安装 2.检查是否安装成功 node -v v10.16.0 npm -v 6.9.0 如果能正常 ...

  8. 学习Vue第一节，Vue的模式与写法格式

    引用Vue <script src="js/vue-2.4.0.js" type="text/javascript" charset="utf- ...

  9. VUE第一个项目怎么读懂

    VUE介绍 VUE是前端开发框架. 原始的前端开发需要工程师写html.写css.写javascript(js).js是脚本语言,浏览器可以运行js来执行一些js支持的动作,例如点击反馈,下拉菜单.操 ...

随机推荐

  1. css画百分比圆环

    html: <div class="circle"> <div class="percent-circle percent-circle-left&qu ...

  2. Spring Boot 静态资源处理，妙！

    作者:liuxiaopeng https://www.cnblogs.com/paddix/p/8301331.html 做web开发的时候,我们往往会有很多静态资源,如html.图片.css等.那如 ...

  3. 2019Android阿里&腾讯&百度&字节面试汇总（附面试题总结、Android书单）

    1.基本情况 先简单说说我今年的面试经历吧,本人2018届211软件工程硕士生,Android开发岗.此文主要是2019年年初春招的面试和秋招面试经验汇总,最终拿到了阿里,腾讯,字节跳动,百度等off ...

  4. 华为Android手机打开Log

    华为Android手机打开Log, 显示日志方法 今天在华为u8650上调试应用程序时,发现Eclipse的log始终无法显示,在网上找了好多资料,甚至stack overflow也查了,最后终于找到 ...

  5. 你创不出伟大的事业，因为……

    你认为自己是对的,而别人都不了解.你忙著实现自己的梦想,却不管你的梦想对这世界有什么意义.你成天想著自己的问题,对别人的问题却提不起任何兴趣. 你活在自己的世界 你认为自己是对的,而别人都不了解.你忙 ...

  6. JavaScript中的方法和属性

    书读百遍其义自见 学习<JavaScript设计模式>一书时,前两个章节中的讲解的JavaScript基础知识,让我对属性和方法有了清晰的认识.如下是我的心得体会以及部分摘录的代码. 不同 ...

  7. ToolStripComboBox 绑定数据

    //添加ComboBox tcbbQueryCondition.ComboBox.DataSource = RelationalOperators.GetAllOperators(); tcbbQue ...

  8. Solr的学习使用之（二）schema.xml等配置文件的解析

    上一篇文章已经讲解了如何部署Solr,部署是部署完了,可是总觉得心里空空的,没底,里面有N多配置文件,比如schema.xml.solrConfig.xml.solr.xml and so on……都 ...

  9. ssh-keygen - 认证密钥的产生, 管理和转换

    总览 (SYNOPSIS) ssh-keygen -words [-q ] [-b bits ] -t type [-N new_passphrase ] [-C comment ] [-f outp ...

  10. rabbitmq 客户端崩溃退出

    1.创建1个队列 和 创建另1个独占队列 名称相同 即崩溃退出 2..rabbitmq是为了实现实时消息推送的吗?