v-bind：属性绑定；

当我们并没有使用v-bind使用的时候，突破不能显示出来，会提示错误，提示我们使用v-bind；

当我们使用v-bind时图片就可以显示：

v-bind的简写是冒号：

使用v-bind进行样式的修改：

进行对字符串的拼接：

以上实例总的代码：

<!DOCTYPE html>

<html>

    <head>

        <meta charset="UTF-8">

        <title>v-bind</title>

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

        <script>

            window .onload= () =>{

                new Vue({

                el:"#one",

                data:{

                    imgurl:"https://cn.vuejs.org/images/logo.png",

                    myWidth:"120px",

                    myHeight:"240px",

                    fileName:"logo.png"

                },

                methods:{

                }

            });

            }

        </script>

    </head>

    <body>

        <div id="one">

        <!--    <img v-bind:src="imgurl" />-->

   <!--    <img :src="imgurl"  :width="myWidth"  :height="myHeight"/>-->

   <img :src="'../res/images/'+fileName"  :width="myWidth"  :height="myHeight"/>

        </div>

    </body>

</html>

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

  1. [vue]v-bind: sytle/class-bind&属性值绑定

    v-bind - style绑定 - class绑定 - 属性值绑定 <!DOCTYPE html> <html lang="en"> <head&g ...

  2. jquery的bind跟on绑定事件的区别

    jquery的bind跟on绑定事件的区别:主要是事件冒泡: jquery文档中bind和on函数绑定事件的用法: .bind(events [,eventData], handler) .on(ev ...

  3. wpf依赖属性、绑定实现原理、附加属性学习

    依赖属性和普通属性相比节省内存的原因:对于普通属性,每个对象有需要存储一个普通属性的值,即便是默认值.而依赖属性的默认值是静态的存储在类中的,所有对象都使用同一默认值,所以对于拥有大量属性的控件来说这 ...

  4. 最新iOS 6 in Xcode4.5新特性——Storyboard和属性自动绑定

    最新iOS 6 in Xcode4.5新特性编程之二(上)——Storyboard和属性自动绑定 从Xcode 4.3开始,Storyboard 就是iOS 5和iOS 6中令人兴奋的一个新特性,他将 ...

  5. 解决IE10以下对象不支持“bind”属性或方法

    IE10一下的浏览器,如果在JS代码中用了bind函数,那么就会报“SCRIPT438: 对象不支持“bind”属性或方法” 因为浏览器没有提供这个参数的方法,所以我们就自己写一个bind,来让这个参 ...

  6. Python面向对象-类、实例的绑定属性、绑定方法和__slots__

    绑定属性 从之前的文章中,我们知道python是动态语言——实例可以绑定任意属性. 那如果实例绑定的属性和类的属性名一样的话,会是什么情况呢? >>> class Student(o ...

  7. jQuery-介绍 加载 选择器 样式操作 属性操作 绑定click事件

    jQuery - 介绍 加载 选择器 样式操作 属性操作 绑定click事件 注意:以下部分问题不能实现效果,因该是单词拼写错误(少个t)或者没有加引号(“swing”)... jquery介绍 jQ ...

  8. WPF进阶技巧和实战08-依赖属性与绑定01

    依赖项属性 定义依赖项属性 注意:只能为依赖对象(继承自DependencyObject的类)添加依赖项属性.WPF中的元素基本上都继承自DependencyObject类. 静态字段 名称约定(属性 ...

  9. ASP.NET MVC 的自定义模型属性别名绑定

    最近在研究 ASP.NET MVC 模型绑定,发现 DefaultModelBinder 有一个弊端,就是无法实现对浏览器请求参数的自定义,最初的想法是想为实体模型的属性设置特性(Attribute) ...

  10. PLSQL_性能优化系列07_Oracle Parse Bind Variables解析绑定变量

    2014-09-25 Created By BaoXinjian

随机推荐

  1. python 类组合

    场景:有一辆车违章需要通知到车主 定义两个类车辆类和通知类,车辆类和通知类并没有共同点,但是要通知车主这两个类就有了关联,这时候可以把这两个类组合在一起 #!/usr/bin/python3 # -* ...

  2. asp.net几个重要对象

    DataSet是用来做连接sql的一种方法,意思是把数据库的副本存在应用程序里,应用程序开始运行时,把数据库相关数据保存到DataSet.DataTable表示内存中数据的一个表.常和DefaultV ...

  3. MySql语句常用命令整理---多表查询

    首先第一张表还是我们单表查询之前用到t_employee,我们在另外新建一个表t_dept(部门表)建表命令如下: drop table if exists t_dept; CREATE TABLE ...

  4. python No tests were found问题解决方法

    由于刚刚开始用python去写测试接口框架,在写的过程中遇到No tests were found问题 原因:python中unittest框架是以Test开头的方法,所以定义方法或类不能以Test开 ...

  5. vuex的使用二

    1.先看项目的目录结构 2.在main.js里需要引入store这个文件并挂在实例上 import store from './store/store' ............ new Vue({ ...

  6. JavaScript学习笔记之call和apply

    前端的知识面太广了,想要记住所有知识点是不可能的,所以将这些学过的记录下来,随时都可以翻开来参考 1.call方法 调用一个对象的一个方法,call(this, arg1, arg2,argN);用来 ...

  7. oracle 修改表结构，增加列，删除列等

    增加一列:ALTER TABLE yourTabbleName ADD columnName dataType; 增加多列:ALTER TABLE yourTabbleName ADD (column ...

  8. [9]Windows内核情景分析 --- DPC

    DPC不同APC,DPC的全名是'延迟过程调用'. DPC最初作用是设计为中断服务程序的一部分.因为每次触发中断,都会关中断,然后执行中断服务例程.由于关中断了,所以中断服务例程必须短小精悍,不能消耗 ...

  9. AmiGO2:在线浏览和查询GO信息的利器

    GO数据库的信息是非常庞大的,为了有效的检索和浏览GO数据库的信息,官方提供了AmiGO, 可以方便的浏览,查询和下载对应信息,官网如下 http://amigo.geneontology.org/a ...

  10. 开发vue单页面Demo

    第1步:安装webpack脚手架 npm install webpack -g (全局安装) (新电脑启动npm run dev版本报错,是因为webpack-server版本更新的问题,要安装pac ...