9. vue常用指令 v-bind 给属性绑定值_vue绑定对象里面的对象的值

作者：Gausst松鼠会 | 2024-04-16 19:59:41

踩

vue绑定对象里面的对象的值

文章目录

1. v-bind:属性名="value"
2. v-model 和 v-bind
- 2.1 v-model只能给 \ \ \元素绑定属性值
- 2.2 v-bind 可以给任何元素绑定属性值
3.官方示例

1. v-bind:属性名=“value”

1.1 value的取值

1.1.1 可以是Vue对象中data中的属性名key
1.1.2 可以是合法的js表达式

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>vue的基本使用</title>
  <!--步骤1 引入vue.js-->
  <script src="js/vue.js"></script>
  <!--也可以使用在线引用-->
  <!-- <script src="https://cdn.jsdelivr.net/npm/vue@2.6.14"></script> -->
</head>
<body>
  <div id="app">
    <ul>
      <li>名字: {
  {name}}</li>
      <li>年龄: {
  {age}}</li>
      <input type="text" v-bind:value="value"/>
      <br/>
      <input type="text" :value="value"/>
      <input type
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22

声明：本文内容由网友自发贡献，不代表【wpsshop博客】立场，版权归原作者所有，本站不承担相应法律责任。如您发现有侵权的内容，请联系我们。转载请注明出处：https://www.wpsshop.cn/w/Gausst松鼠会/article/detail/436170