PLM之家PLMHome-国产软件践行者

[前端框架] Vuejs 属性绑定和双向数据绑定

[复制链接]

2019-8-6 16:08:30 2080 0

admin 发表于 2019-8-6 16:08:30 |阅读模式

admin 楼主

2019-8-6 16:08:30

请使用QQ关联注册PLM之家,学习更多关于内容,更多精彩原创视频供你学习!

您需要 登录 才可以下载或查看,没有账号?注册

x
- |! l9 J9 c- V6 X2 C
! H! R% L) u' r
8 @# w; E( [# R; X8 m4 Z  _3 S
<!DOCTYPE html>
; U. E& K! ]# A2 F+ h% A2 |& f8 D<html lang="en">: x4 g3 }$ T) P' L3 H1 \& \

8 _* O) i8 m) U- J0 X<head>2 s0 L2 s3 R! m+ g2 F
    <meta charset="UTF-8">: e" c* |' R+ r" F0 h) g# k
    <title>Event Bind</title>2 p$ X( E3 f6 t5 j
    <script src="./vue.js"></script>+ N8 D$ L$ i! N9 M. s* {' q" W/ K" [
</head>
: P, V. ]: M3 I: x+ L6 M8 L
0 Z* T- ]! x7 s( x- _: l2 K<body>
6 m) {* E9 F: \5 H    <div id="root">
" C$ O8 J0 _& g3 S* w: k$ B        <div :title="title">Hello World</div>
7 F9 Q. X; E! I1 i. }/ z# U" V        <!-- v-bind: is the same as : -->
0 o; |* h9 @0 W9 n% f; l! ~7 v        <!-- v-model -->9 H# }* T1 @+ D, }
        <input type="text" v-model="content" />
: K" a0 B# S* z- W6 h8 U! M- Q1 d, Y/ Y; m        <div>{{content}}</div>% |$ k' }( x- H* |  H
    </div>! _# x' Z/ j0 ?( K
    <script>
$ j2 W5 [3 Y8 D5 X        new Vue(" \2 t2 |- M( j' O
            {; N- H  o+ K5 @/ k' L4 D
                el: root,2 x6 A  W" y( s+ h; L$ O6 q
                data: {
# V. t+ V+ l7 C, q0 w- `* F                    title: "this is hello world",; g! Y: `0 r6 R7 j! l
                    content: "this is content"
7 k9 Q' m  Y7 l$ N% M+ e2 f                },
& u( o  y2 [+ x% q; ^                methods: {
# g' h8 j. F& u0 Q5 W5 }% V
7 N0 x4 P+ f: J1 ^* L                }
4 `1 r- z1 b3 p/ r# _* Y. I            }
4 Q0 e; o, h" w# ?) J/ a        )
3 x' f1 Y2 h. g! S* ~    </script>5 ~! ?  c1 q- J$ O+ }6 h6 `3 c
</body>
1 @" h6 r& Q! K$ f$ I8 n3 g. Q9 p
+ x6 h/ _" G, m</html>
) E. x' q1 C1 x% ^+ i
% R/ `# ?7 X! q6 R4 D

" o. l0 a) ^2 |5 j7 x9 |6 Q
上海点团信息科技有限公司,承接UG NX,CATIA,CREO,Solidworks 等CAx软件,Teamcenter,3D Experience等PLM软件,工业4.0数字化软件的实施\二次开发\培训相关业务,详情QQ 939801026 Tel 18301858168 网址 doTeam.tech
回复

使用道具 举报

发表回复

您需要登录后才可以回帖 登录 | 注册

返回列表 本版积分规则

  • 发布新帖

  • 在线客服

  • 微信

  • 客户端

  • 返回顶部

  • x
    温馨提示

    本网站(plmhome.com)为PLM之家工业软件学习官网站

    展示的视频材料全部免费,需要高清和特殊技术支持请联系 QQ: 939801026

    PLM之家NX CAM二次开发专题模块培训报名开始啦

    我知道了