<!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. Java 不被看好前景堪忧？可能是想多了！

    Java技术栈 www.javastack.cn 优秀的Java技术公众号 来源:代码湾 Java发行二十多年来,尤其是在战胜C和C++成为最受程序员喜欢的编程语言之后,一直都是开发者的宠儿. 虽然斯 ...

  2. Spring Boot静态资源

    1.4 SpringBoot静态资源 1.4.1 默认静态资源映射 Spring Boot 对静态资源映射提供了默认配置 Spring Boot 默认将 /** 所有访问映射到以下目录: classp ...

  3. Codeforces 1110F(DFS序+线段树）

    题面 传送门 分析 next_id = 1 id = array of length n filled with -1 visited = array of length n filled with ...

  4. Codeforces 1000E We Need More Bosses (边双连通+最长链)

    <题目链接> 题目大意:给定一个$n$个节点$m$条边的无向图,问你对任意两点,最多有多少条特殊边,特殊边指删除这条边后,这两个点不能够到达. 解题分析: 特殊变其实就是指割边,题意就是问 ...

  5. Mint-Linux【最佳】【快速】安装微信、企业微信、TIM、QQ等软件

    废话不多说 直接上教程 注意看 方式一.在线安装 在本地目录下.如 /home/root/Document 直接使用在线安装脚本,安装最新的Release版本: wget -qO- https://r ...

  6. 【JAVA】java编译错误：编码UTF8/GBK的不可映射字符

    环境: win7 cmd窗口编译 javac xx.java时报错 错误显示:错误:编码GBK的不可映射字符 背景: 分析发现是中文字符所在行报错了 查阅相关资料发现,是因为编译器设置为了utf-8, ...

  7. vue项目一个页面使用多个轮播图详解

    1.html代码: <div v-for="(item,index) in arrDataList.Floor"> // 根据后台数据循环渲染多个轮播图组件 <d ...

  8. BZOJ-2337 XOR和路径（HNOI2011）概率DP+概率的线性叠加

    题意:给出n个点和m条边,每条边有权值wi,从1出发,每次等概率选一条出边走,直到终点n停止,得到的值是路径所有边的异或和.问异或和期望. 解法:这道题非常有意思!首先比较直观的想法就是dp[x]代表 ...

  9. 异常 Cannot resolve class or package

    spring boot yml配置异常Cannot resolve class or package 是因为mvaen设置 pom.xml的文件配置如上,scope 范围指定为runtime,runt ...

  10. Adblock Plus 添加过滤规则

    过滤掉相关的DIV 如要过滤某网站的 如例1:  home.firefoxchina.cn##div#module-game##元素#名字 过滤掉ID为名字的元素##div.名字 class为名字的D ...