#需要用到一个vue文件，还有一个自己的js文件main.js
<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">

    <title>Title</title>

</head>

<body>

<div id="app">

    <div>

        <input type="text" v-model="name">

        <span v-show="name">你的名字是:{{name}}</span>

    </div>

    <div>

        <input type="text" v-model="age">

        <span v-show="age">你的年龄是:{{age}}</span>

    </div>

    <div>

        <input type="text" v-model="sex">

        <span v-show="sex">你的性别是:{{sex}}</span>

    </div>

</div>

<script src="../lib/vue.js"></script>

<script src="js/main.js"></script>

</body>

</html>

js代码：

var app = new Vue(

    {

        el:"#app",

        data:{

            name:"",

            age:"",

            sex:"",

        }

    }

)

vue的安装以及语法介绍的更多相关文章

  1. Vue.js 学习入门：介绍及安装

    Vue.js 是什么? Vue (读音 /vjuː/,类似于 view) 是一套用于构建用户界面的渐进式框架.与其它大型框架不同的是,Vue 被设计为可以自底向上逐层应用.Vue 的核心库只关注视图层 ...

  2. Vue.js模板语法介绍

    Vue.js模板.指令 模板语法概述 1.如何理解前端渲染? ​ 把数据填充到HTML标签中,一般我们使用Ajax将数据从后台查询出,结合模板() 2.前端渲染方式 2.1.原生js拼接字符串 ​ 使 ...

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

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

  4. Webstorm添加新建.vue文件功能并支持高亮vue语法和es6语法

    转载:https://blog.csdn.net/qq_33008701/article/details/56486893 Webstorm 添加新建.vue文件功能并支持高亮vue语法和es6语法 ...

  5. node服务的安装以及vue的安装

    相信很多朋友都在装node服务和安装vue的时候会遇到一些问题,下面为大家详细介绍node服务的安装以及vue的安装: 1.nodeJs官网下载版本(根据自己电脑的配置进行相应下载即可):默认安装路径 ...

  6. vue对比其他框架详细介绍

    vue对比其他框架详细介绍 对比其他框架 — Vue.jshttps://cn.vuejs.org/v2/guide/comparison.html React React 和 Vue 有许多相似之处 ...

  7. 01: vue.js安装

    1.1 vue.js安装与基本使用 官网:https://cn.vuejs.org/ 1.使用之前,我们先来掌握3个东西是用来干什么的 1. npm: Nodejs下的包管理器. 2. webpack ...

  8. Webstorm 添加新建.vue文件功能并支持高亮vue语法和es6语法

    添加新建.vue文件功能 ①Webstorm 右上角File-Plugins 搜索vue如果没有就去下载 点击serch in repositories ②点击安装vue.js ③安装成功后点击右下角 ...

  9. npm安装使用及vue脚手架安装

    公司在前端用vue开发项目,那就学习下啦,第一步,在安装vue-devtools过程中,npm作为官方manual installtion方式,肯定必不可少. NPM是随同NodeJS一起安装的包管理 ...

随机推荐

  1. PYDay5- 数据类型set、三元运算、函数

    1.set set集合,是一个无序且不重复的元素集合 class set(object): """ set() -> new empty set object se ...

  2. swift写一个简单的列表unable to dequeue a cell with identifier reuseIdentifier - must register a nib or a cla

    报错:unable to dequeue a cell with identifier reuseIdentifier - must register a nib or a class for the ...

  3. python第三方库之openpyxl(1)

    python第三方库之openpyxl(1) 简介 Openpyxl是一个用于读写Excel 2010 xlsx/xlsm/xltx/xltm文件的Python库,其功能非常强大.Excel表格可以理 ...

  4. BNUOJ 4215 最长公共连续子序列

    最长公共连续子序列 Time Limit: 1000ms Memory Limit: 65536KB   64-bit integer IO format: %lld      Java class ...

  5. .NET重构（四）：窗体继承+模板方法，完美实现组合查询

    导读:在机房重构中,有好些个查询都是大同小异,最为显著的就是组合查询了.怎样给自己省事儿,相同的东西能不能重复利用,就成了一个现实的问题.第一遍做机房的时候,使用的更多的是:复制+粘贴.学习了设计模式 ...

  6. 九度oj 题目1472：求两个多项式的和

    题目描述: 输入两个多项式,计算它们的和. 每个多项式有若干对整数表示,每组整数中,第一个整数表示系数(非0),第二个整数表示该项的次数. 如由3 3 5 -2 1 4 0表示3x^5 - 2 * x ...

  7. nginx报错 too many open files in system

    系统进不去了,用ssh连接服务器也非常慢,负载均衡显示后端连接异常,重启mysql数据库,发现经常重启,或者直接关机,访问页面也访问不到. http://www.51testing.com/html/ ...

  8. 刷题总结——道路覆盖（ssoj）

    题目: 题目描述 Tar 把一段凹凸不平的路分成了高度不同的 N 段(每一段相同高度),并用 H[i] 表示第 i 段高度.现在 Tar 一共有 n 种泥土可用,它们都能覆盖给定的连续的 k 个部分. ...

  9. 【单调队列+尺取】HDU 3530 Subsequence

    acm.hdu.edu.cn/showproblem.php?pid=3530 [题意] 给定一个长度为n的序列,问这个序列满足最大值和最小值的差在[m,k]的范围内的最长子区间是多长? [思路] 对 ...

  10. noip2017爆炸记——题解&总结&反省（普及组+提高组）

    相关链接: noip2018总结 noip2017是我见过的有史以来最坑爹的一场考试了. 今年北京市考点有一个是我们学校,我还恰好被分到了自己学校(还是自己天天上课的那个教室),于是我同时报了普及提高 ...