vue 字典配置_Vue 数组 字典 template v-for 的使用

1

2

3

4

5

6

7

8

9

10

11

v-for 循环

12

13 {{ characters[0] }}14 {{ characters[1] }}15 {{ characters[2] }}16

17

18

19 {{character}}20

21

22

---

23

24

25 {{ user }} - {{ user.name }} -{{ user.age }}26

27

28

---

29

30

31

32 {{ index }} - {{ user.name }} -{{ user.age }}33

34

35

36

37

{{ index+1 }} . {{ user.name }}

38

 Age: {{ user.age }}

39

40

---

41

使用template+v-for

42

43

{{ index+1 }}.{{ user.name }}

44

 Age:{{ user.age }}

45

46 以上两种情况 有什么不同？47 查看html便知48

49

使用template+v-for 再加 内 循环 v-for

50

51

52 {{ key }}-{{ value }}53

54

55

56

57

58

HTML

1 newVue({2 el:'#vue-app',3 data:{4 characters:['Mario','Luffy','Yoshi'],5 userMsg:[6 {name:"Henry",age:30},7 {name:"Bucky",age:30},8 {name:"Emily",age:30},9 ],10 },11 methods:{12

13 },14 computed:{15

16 }17 })

Vue.js

-------------------------------------------------------------------------------------------------------------------------------------------------------------------------

Pi 软件安卓版 链接：https://pan.baidu.com/s/1AjWTsROL2ohe24AM55eFGQ

由于Pi是邀请制需要邀请码为：whlgjjgyy

-------------------------------------------------------------------------------------------------------------------------------------------------------------------------