新建一个hello.html文件，输入以下内容：

<html>

<head>

    <title></title>

    <script src="https://unpkg.com/vue"></script>

</head>

<body>

    <p id="app">

      {{ message }}

    </p>

    <script type="text/javascript">

        var app = new Vue({

        el: '#app',    //这是element

        data: {

             message: 'Hello Vue!'

            }

        })

    </script>

</body>

</html>

打开后就是Hello Vue!。

打开控制台，输入app.message = "Hello world!"，那么页面就会动态变化成Hello world!。

使用Chrome浏览器。

<div id="app">

    <p>{{ message }}</p>

    <input type="text" v-model="message"/>

</div>

修改代码，在input里写字，<p>的内容会跟着变。

一个单js文件也可以运行vue的更多相关文章

  1. grunt-contrib-watch 监控 JS 文件改变来运行预定义的Tasks

    依赖于 GruntJs ~0.4.0 监控 JS 文件改变来运行预定义的Tasks Demo: watch: { scripts: { files: ['src/**/*.js'], tasks: [ ...

  2. JSFinder：一个在js文件中提取URL和子域名的脚本

    JSFinder介绍 JSFinder是一款用作快速在网站的js文件中提取URL,子域名的脚本工具. 支持用法 简单爬取 深度爬取 批量指定URL/指定JS 其他参数 以往我们子域名多数使用爆破或DN ...

  3. thinkPHP为什么设置一个单入口文件？

    TP3.2的具体解释: ThinkPHP采用单一入口模式进行项目部署和访问,无论完成什么功能,一个应用都有一个统一(但不一定是唯一)的入口. 应该说,所有应用都是从入口文件开始的,并且不同应用的入口文 ...

  4. 一个日期Js文件。 2013年10月12日 星期六 癸巳年九月初八

    1.简单用法 <div align="center">  <SCRIPT language=JavaScript src="js/calendar.js ...

  5. vue/cli项目添加外部js文件的一个方法

    有一个util.js文件,内容如下 function Util () { ... } export default new Util() 可以在main.js里面通过import引入js import ...

  6. vue引入自己写的js文件

    话不多说,直接上代码呀~ 先来个结构图: 中规中矩的vue-cli就写了一个自己的js文件 那么我想要引入到vue组件里. 1.首先写我的js文件 2.引入到vue组件!!!一定要用{}把方法名拿过来 ...

  7. vue 调用常量的config.js文件

    我遇到问题,就是有很多常量需要应用的项目里面.所以需要打算设置一个config.js文件 1.填写config.js 文件 //常量配置 //快递公司名单 对应的页面为: src/pages/othe ...

  8. Vue在单独引入js文件中使用ElementUI的组件

    Vue在单独引入js文件中使用ElementUI的组件 问题场景: 我想在vue中的js文件中使用elementUI中的组件,因为我在main.js中引入了element包和它的css,并挂载到了全局 ...

  9. Js文件函数中调用另一个Js文件函数的方法

    在项目中Js文件需要完成某一功能,但这一功能的大部分代码在另外一个Js文件已经完成,只需要调用这个文件实现功能.那么如何调用:一个Js文件函数中调用另一个Js文件函数的方法? (直接代码说明) 示例d ...

随机推荐

  1. 全球最大轻博客APP确认被苹果下架!

    读 苹果确认了App Store下架轻博客应用Tumblr,主要原因是,该应用没有很好的过滤掉一些成人内容(成人内容多到夸张),这严重影响了未成年人. 事实上,iPhone和iPad版Tumblr应用 ...

  2. Spring各个jar包的作用

    Spring AOP:Spring的面向切面编程,提供AOP(面向切面编程)的实现 Spring Aspects:Spring提供的对AspectJ框架的整合Spring Beans:Spring I ...

  3. ansible系列8-SSH连接和执行性能优化

    1. 当你的SSH的版本高于5.6时 我们可以直接修改 /etc/ansible/ansible.cfg里面的参数 ssh_args = -C -o ControlMaster=auto -o Con ...

  4. BZOJ1774[USACO 2009 Dec Gold 2.Cow Toll Paths]——floyd

    题目描述 跟所有人一样,农夫约翰以着宁教我负天下牛,休叫天下牛负我的伟大精神,日日夜夜苦思生 财之道.为了发财,他设置了一系列的规章制度,使得任何一只奶牛在农场中的道路行走,都 要向农夫约翰上交过路费 ...

  5. BZOJ4723[POI2017]Flappy Bird——模拟

    题目描述 <飞扬的小鸟>是一款风靡的小游戏.在游戏中,小鸟一开始位于(0,0)处,它的目标是飞到横坐标为X的某个位置 上.每一秒,你可以选择点击屏幕,那么小鸟会从(x,y)飞到(x+1,y ...

  6. 【转】嵌入式系统 Boot Loader 技术内幕，带你完全了解Boot Loader

    在专用的嵌入式板子运行 GNU/Linux 系统已经变得越来越流行.一个嵌入式 Linux 系统从软件的角度看通常可以分为四个层次: 1. 引导加载程序.包括固化在固件(firmware)中的 boo ...

  7. 洛谷 P1110 [ZJOI2007]报表统计 解题报告

    P1110 [ZJOI2007]报表统计 题目描述 \(Q\)的妈妈是一个出纳,经常需要做一些统计报表的工作.今天是妈妈的生日,小\(Q\)希望可以帮妈妈分担一些工作,作为她的生日礼物之一. 经过仔细 ...

  8. luogu1966 火柴排队(离散化+树状数组)

    由于是一个二次函数的关系,所以易证应该尽量让两组的顺序相同 然后就离散化乱搞几发,最后就变成了求逆序对的数量了 #include<bits/stdc++.h> #define pa pai ...

  9. centos6.5下修改文件夹权限和用户名用户组

    0.说明 Linux系统下经常遇到文件或者文件夹的权限问题,或者是因为文件夹所属的用户问题而没有访问的权限.根据我自己遇到的情况,对这类问题做一个小结. 在命令行使用命令"ll"或 ...

  10. 【POJ1015】Jury compromise 多个费用的背包

    这是一道比较综合的动态规划问题. 首先,根据题目中的从N个人中选出M个人,并且要使得某个目标函数最优,可以想到是背包问题,且因为要取出M个人,人数也应该作为背包体积的一个维度. 其次,要求输出路径,因 ...