Vue2.0开发之——Vue基础用法-属性绑定指令(17)

发表于 2022-11-09 分类于开发， C-前端开发， Vue2 阅读时长 ≈ 1 分钟

一概述

属性绑定指令介绍
属性绑定指令示例

二属性绑定指令介绍

如果需要为元素的属性动态绑定属性值，则需要用到v-bind属性绑定指令。
用法示例：v-bind:placeholder="tips"
v-bind可以省略，:placeholder="tips"

三属性绑定指令示例

3.1 代码

<div id="app">
      <input type="text" v-bind:placeholder="tips">
      <hr>
      <img :src="photo" alt="" style="width: 100px;">
</div>
<script>
   const vm = new Vue({
    el:'#app',
    data:{
        tips:'请输入用户名',
        photo:'https://v2.vuejs.org/images/logo.svg'
    }
   })
</script>

3.2 效果图

0%