新建一个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. Bootstrap 引入文件顺序及IE兼容性js

    <!DOCTYPE html><html lang="zh-cn"><head> <meta charset="utf-8&qu ...

  2. linux shell $ 特殊变量

    $0   #Shell本身的文件名 $1-$n   #添加到Shell的各参数值.$1是第1参数.$2是第2参数… $*   #所有参数列表.如"$*"用「"」括起来的情 ...

  3. loadrunner基础学习笔记八-分析场景

    analysis会话的目的是查找系统的性能问题,然后找出这些问题的根源 如: 是否达到了预期的测试目标,在负载下对用户终端的事务响应时间是多少 是否符合sla还是偏离了目标 事务的平均响应时间是多少 ...

  4. xhtml的3種文檔聲明類型

    xhtml有三種文檔聲明類型: strict:使用嚴格的標記,避免語法上的混亂: trasitional:為不支持的css的瀏覽器編寫xhtml時: frameset:利用框架將窗口分割為兩個部分或多 ...

  5. Lodop窗口的按钮、权限，隐藏或设置功能不可用

    Lodop隐藏某个按钮或部分,具体参考Lodop技术手册 SET_SHOW_MODE篇.以下是几个例子,(对应下图图片): 第一种:LODOP.SET_SHOW_MODE ("HIDE_PB ...

  6. codeforces580C

    Kefa and Park CodeForces - 580C 一棵以1为根的树,树上有些点是红的.一个叶子是合法的当且仅当从根到它的路径上出现的连续红点个数不超过m.求有多少个叶子是合法的.Inpu ...

  7. Rob Pike 编程五原则

    Rob Pike's 5 Rules of Programming Rule 1: You can't tell where a program is going to spend its time. ...

  8. Apache虚拟主机

    基本概述 虚拟Web主机 在同一台服务器中运行多个Web站点,其中每一个站点并不独立占用一台真正的计算机 httpd支持的虚拟主机类型 基于域名的虚拟主机 基于IP地址的虚拟主机 基于端口的虚拟主机 ...

  9. Django-website 程序案例系列-7 创建多对多关系表

    创建多对多关系表: 方式一:一共三张表其中有一张中间表需要手工建立(建议使用第一种方式自定制程度高) class Host(models.Model): hostname = models.CharF ...

  10. BZOJ1069 SCOI2007最大土地面积（凸包+旋转卡壳）

    求出凸包,显然四个点在凸包上.考虑枚举某点,再移动另一点作为对角线,容易发现剩下两点的最优位置是单调的.过程类似旋转卡壳. #include<iostream> #include<c ...