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

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

[复制链接]

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

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

admin 楼主

2019-8-6 16:08:30

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

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

x

) h5 a5 D$ y7 X: B' i
- P* z' }0 A' s/ y$ p2 f+ h* P! {% N5 O5 S/ N7 R
<!DOCTYPE html>
5 C' U# K# F4 q4 n<html lang="en">/ L2 E' S. \" w. g

4 l; P& m& h, ^$ A% Y. z5 u) W" j<head>
0 x* S+ J, y% q# z( p! M+ d    <meta charset="UTF-8">. a" U  X8 _1 v7 M
    <title>Event Bind</title>
. w4 @  X$ [4 Q3 f; j. e    <script src="./vue.js"></script>9 f8 B( p. r7 p
</head>
3 S, ]7 u6 y- M" x* ~2 m8 j. A1 h- v
<body>
" T6 j' z, U2 w, q    <div id="root">4 r. s% p0 d3 `$ H# \' P3 p- F4 C* {
        <div :title="title">Hello World</div>' Z/ e0 v0 |# y1 E4 F
        <!-- v-bind: is the same as : -->5 j! P+ s8 V3 N4 K$ [
        <!-- v-model -->
& {5 {% X! ^' F# X. |5 b        <input type="text" v-model="content" />4 V% k& v4 R9 x: g' }2 X; H% _8 C
        <div>{{content}}</div>
% N) y6 O# }) i/ |    </div>
+ W  h2 q& E: s5 i4 ]7 p    <script>0 g% n9 w6 a- R  {+ j. l
        new Vue(
8 A" n/ o: Y% B4 j- q3 r            {3 U4 G; ~3 T1 J6 i
                el: root,
! N  f8 x* P: a3 Z  |. O                data: {  s4 }& @" Q( \
                    title: "this is hello world"," n* |5 j3 b8 K2 }: Q* H
                    content: "this is content"! T6 V; u+ b- {  f) _  F
                },0 E9 v1 f# E# S. \. E
                methods: {. Y  E5 i8 U. j$ _# n
3 ]6 P) K( m- L( n6 [
                }- ^' r3 ?( b5 }2 y2 Y! w3 |( l
            }
: k  E' p" K5 P0 c# j, h, g        )1 S- l+ M' \8 h7 `3 Z( |2 h
    </script>2 Z" E0 X, H' }( G4 n- \, W7 N
</body>
  f% Y1 ~* f0 s: }! J6 o) I0 B, N, f
7 @5 t2 k, [$ U  X" V6 ^# ~</html>
& R' N, x) z; ~' n# z5 s

4 f6 o2 F; f+ A) Z4 P2 s
5 g3 p2 `$ F* {" w- h
上海点团信息科技有限公司,承接UG NX,CATIA,CREO,Solidworks 等CAx软件,Teamcenter,3D Experience等PLM软件,工业4.0数字化软件的实施\二次开发\培训相关业务,详情QQ 939801026 Tel 18301858168 网址 www.diantuankj.com/ doTeam.tech
回复

使用道具 举报

发表回复

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

返回列表 本版积分规则

  • 发布新帖

  • 在线客服

  • 微信

  • 客户端

  • 返回顶部

  • x
    温馨提示

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

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

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

    我知道了