未绑定

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title>Document</title>
    <style type="text/css">
        [v-cloak]{
            display: none;
        }
    </style>
</head>
<body>
    <div id="app">
        <div>{{msg2}}</div>
        <div v-text="msg2"></div>
        <!-- 前两个只是打印 <h1>哈哈，我是一个大大的H1，我大，我骄傲</h1>-->
        <!-- v-html可以打印html标签 -->
        <div v-html="msg2"></div>

<!-- v-bind 是Vue 中提供用于绑定属性的指令 -->
        <input type="button" value="按钮" title="mytitle">
    </div>

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

<script>
        var vm=new Vue({
            el:'#app',
            data:{
                msg:'123',
                msg2:'<h1>哈哈，我是一个大大的H1，我大，我骄傲</h1>',
                mytitle:'这是一个自己定义的title'
            }
        })
    </script>

</body>
</html>

绑定

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title>Document</title>
    <style type="text/css">
        [v-cloak]{
            display: none;
        }
    </style>
</head>
<body>
    <div id="app">
        <div>{{msg2}}</div>
        <div v-text="msg2"></div>
        <!-- 前两个只是打印 <h1>哈哈，我是一个大大的H1，我大，我骄傲</h1>-->
        <!-- v-html可以打印html标签 -->
        <div v-html="msg2"></div>

<!-- v-bind 是Vue 中提供用于绑定属性的指令 -->
        <input type="button" value="按钮" v-bind:title="mytitle">  //mytitle是一个变量 后面还可以+ ‘123’ //： == v-bind: (简写)
    </div>

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

<script>
        var vm=new Vue({
            el:'#app',
            data:{
                msg:'123',
                msg2:'<h1>哈哈，我是一个大大的H1，我大，我骄傲</h1>',
                mytitle:'这是一个自己定义的title'
            }
        })
    </script>

</body>
</html>

绑定属性 - v-bind的更多相关文章

  1. [十六]SpringBoot 之 读取环境变量和绑定属性对象

    1.读取环境变量 凡是被spring管理的类,实现接口EnvironmentAware 重写方法 setEnvironment 可以在工程启动时,获取到系统环境变量和application配置文件中的 ...

  2. jQuery事件绑定on()、bind()与delegate() 方法详解

    jquery中有四种事件绑定函数,bind(),live(),on(),delegate(),由于live现在并不常用,因此不做过多解释. 1. bind()用法 $("div p" ...

  3. Compounding绑定属性

    声明:原创作品,转载时请注明文章来自SAP师太技术博客( 博/客/园www.cnblogs.com):www.cnblogs.com/jiangzhengjun,并以超链接形式标明文章原始出处,否则将 ...

  4. react事件处理函数中绑定this的bind()函数

    问题引入 import React, { Component } from 'react'; import { Text, View } from 'react-native'; export def ...

  5. class中限定绑定属性__slots__方法

    使用__slots__但是,如果我们想要限制class的属性怎么办?比如,只允许对Student实例添加name和age属性.为了达到限制的目的,Python允许在定义class的时候,定义一个特殊的 ...

  6. Vue 目录结构 绑定数据 绑定属性 循环渲染数据

    一.目录结构分析 node_modules 项目所需要的各种依赖 src 开发用的资源 assets 静态资源文件 App.vue 根组件 main.js 配置路由时会用 .babelrc 配置文件 ...

  7. v-bind绑定属性样式——class的三种绑定方式

    1.布尔值的绑定方式 <div id="demo"> <span v-bind:class="{‘class-a‘:isA ,‘class-b‘:isB ...

  8. React对比Vue（02 绑定属性，图片引入，数组循环等对比）

    import React, { Component } from 'react'; import girl from '../assets/images/1.jpg' //这个是全局的不要this.s ...

  9. Angular4.x 创建组件|绑定数据|绑定属性|数据循环|条件判断|事件|表单处理|双向数据绑定

    Angular4.x 创建组件|绑定数据|绑定属性|数据循环|条件判断|事件|表单处理|双向数据绑定 创建 angular 组件 https://github.com/angular/angular- ...

随机推荐

  1. 解决ajax异步请求数据后swiper不能循环轮播(loop失效)问题、滑动后不能轮播的问题。

    问题描述: 1.我使用axios异步请求后台的图片进行渲染后不能实现循环轮播,也就是loop失效,但是静态写死的情况下不会出现这种问题. 2. 分析: swiper的机制是:初始化的时候将swiper ...

  2. pip使用豆瓣的镜像源

    豆瓣镜像地址:https://pypi.douban.com/simple/ 虽然用easy_install和pip来安装第三方库很方便 它们的原理其实就是从Python的官方源pypi.python ...

  3. Sublime text 3 For LINUX 注册方法＆关闭更新提示

    在 /etc/hosts 文件加入以下 127.0.0.1 www.sublimetext.com 127.0.0.1 license.sublimehq.com 然后再Sublime输入以下注册码 ...

  4. P3649 [APIO2014]回文串

    思路 回文自动机 回文自动机的fail[i]就是编号为i的这个字符串的最长的回文后缀的编号,然后len[i]表示编号为i的回文串的长度,cnt[i]表示编号为i的回文串的出现次数 然后trans边就是 ...

  5. map的循环删除操作

    1.错误示例 Map<String,InterfaceOutParam> outCodes1 = outParamList.stream().collect(Collectors.toMa ...

  6. 2017 Russian Code Cup (RCC 17), Elimination Round D - Acute Triangles

    D - Acute Triangles 思路: 极角排序+点积叉积 在一个三角形中,如果它是直角或者顿角三角形,那么直角和顿角只会出现一次 所以直角和顿角三角形的个数等于直角和顿角的个数 所以锐角三角 ...

  7. guxh的python笔记一：数据类型

    1,基本概念 1.1,数据类型 基本数据类型:字符串,数字,布尔等 引用数据类型:相对不可变(元组),可变(列表,字典,集合等) 基本数据类型存放实际值,引用数据类型存放对象的地址(即引用) ==:判 ...

  8. 如何从零开始在github上新建项目

    准备工作: (1)安装git: Git-2.16.1-64-bit.exe (2)新建一个文件夹grpc007,作为本地git仓库 (3)进入到grpc007目录,右键/打开git bash.使用gi ...

  9. linux系统下如何挂载NTFS移动硬盘

    前言 数据迁移是我们经常会遇到的,有时候做大数据量迁移时,为了快速迁移大数据,有可能在Linux服务器上临时挂载NTFS格式的移动硬盘, 一般情况下,Linux是识别不了NTFS格式移动硬盘的(需要重 ...

  10. RobotFramework--环境安装1

    1.RobotFramework RobotFramework 的架构是一个通用型的验收测试和验收测试驱动开发的自动化测试框架(ATDD).它 具有易于使用的表格来组织测试过程和测试数据. 3.1版本 ...