PLM之家PLMHome-工业软件践行者

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

[复制链接]

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

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

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

x
( g7 p9 |% ]; [* @% z- q
6 P4 N5 R9 g3 z6 l1 S; i- U

( Q% q" a  @% T5 y" c6 R" W: }<!DOCTYPE html>
7 m) W0 l( L3 l<html lang="en">
3 r( T, Q$ F7 D! h. C1 j" l3 U5 K2 J
<head>
2 V' J* D, d: _- a- A+ u7 R- _) [    <meta charset="UTF-8">+ }4 d- _3 {4 X( o4 P# P6 n9 y
    <title>Event Bind</title>
' o3 u: [: g; w# {7 E8 p, u( J2 y    <script src="./vue.js"></script>9 M! t  t8 E7 [9 {
</head>
, ?9 t- t: X- Q5 [! J
2 @5 O. _2 H$ F( v1 R2 h, a& j( }4 q<body>
0 U8 d+ t* G4 \% |: Q. ~; M2 c& D3 C0 o    <div id="root">8 l: t3 L1 s& M2 g% B" C1 f
        <div :title="title">Hello World</div>; j/ v) t. i; z/ D" G+ [
        <!-- v-bind: is the same as : -->
5 O% o1 E1 V. W; g) @2 S        <!-- v-model -->5 ?. c6 ~7 \+ M8 C9 r
        <input type="text" v-model="content" />7 E5 z- {* N: O) ~) C
        <div>{{content}}</div>
6 o4 e  r+ \4 I6 T3 o    </div>
9 e/ r3 I. F0 o9 A    <script>
0 \; ~$ y9 [, E3 \* r1 l3 w        new Vue(
0 d: S# x6 }5 {$ f: n$ {            {
' h. b/ Q/ ^! Y) M5 ^                el: root,; x# P9 N* Z* o$ h. X
                data: {
5 y2 f1 t& W7 z+ @3 ~2 Q( ~& [$ w                    title: "this is hello world",
' |& u7 F3 [2 J0 |& I" x                    content: "this is content"5 h4 E5 J7 h8 e& V9 r5 x. r
                },' t3 D5 I0 b7 R0 u
                methods: {6 ^# v! Z, H6 d1 d. f! a) N; c

" R- C; G# I" E! R! o                }
6 M1 z( N9 I/ w' @- O4 P  y# H; K            }- ~* b+ B/ G. B7 x+ ^
        )
; k& ?8 M& n2 U& I3 C4 A+ |8 u    </script>
' R1 c+ \: q$ p2 h% _; p5 @" P3 i</body>& B) V, B9 }; G9 W( U4 c& i) D+ R
" _2 ]0 Y+ Y8 b6 G9 @. {
</html>9 h! |- `( D8 B7 D) Q) U
; V( X/ ]3 W! v2 b& D

# n4 d) _6 B* {3 z
上海点团信息科技有限公司,承接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二次开发专题模块培训报名开始啦

    我知道了