|
|
请使用QQ关联注册PLM之家，学习更多关于内容，更多精彩原创视频供你学习！
您需要 登录 才可以下载或查看，没有账号？注册
x
5 u( g9 I, B* E( a% @0 \# r
$ x4 u8 f. b& S<!DOCTYPE html>
% t1 u! x( `* ]+ h, y9 A3 C$ b<html lang="en">
" }6 W' V: X# S* }: r
4 G5 }$ u% s- q, i: A1 w5 u<head>
" a( X1 u! X4 A; w4 e <meta charset="UTF-8">
f- X, K# B9 d" N <title>Event Bind</title>' B3 O% V# l9 p4 a; B* C. A% O- s6 ]
<script src="./vue.js"></script>4 k! ?* T. C7 v4 j, m/ P3 p
</head>
. s9 L0 A* c: S, J# m
5 W: H# ?9 i2 D. e2 e<body>
8 y: B* U" l, W5 h& w2 V7 j: O <div id="root">
; Y3 [( w$ V$ ~" m First Name: <input type="text" v-model="firstName" />4 E/ U8 V3 C5 n
Last Name: <input type="text" v-model="lastName" />: b$ r2 \* O& o' t
<div>0 o$ o1 @9 C4 o$ g; ?
Full Name : {{fullname}}
) M- _1 I) v+ {8 G </div> B9 e2 a( v& V6 A3 C! S5 Q
<div>
$ T% Z1 O. _/ ~5 Y% A1 c) M <h2>{{changeTime}}</h2>
' ~1 r+ m) w! S: i$ C$ f% [& x </div>
) A! f* z6 o; o/ G. y6 Y; ~% h </div>
2 O& u- F# F5 T/ {, M( T5 ~ <script>
2 z; ^5 c$ ?! f( m c$ u new Vue(
) R6 V U; X! c4 r9 K {
, r) H3 x2 A. ` v5 }" N5 t1 { el: root,
5 q6 g8 L8 Z6 C data: {
- T" U$ g9 C; F9 P7 K- \ firstName: '',
! W) M9 h7 Z Z lastName: '',& C0 z6 ]( y+ a5 t2 P
changeTime: 0
7 E% g' m6 k4 v },
% Y0 a8 y+ T" R: s# ^9 J6 c$ M methods: {
$ b: o9 @6 T7 f* \! I6 X; W) g3 O% \# _# d& |
},( B( F: o7 h1 p. X8 s. q" s
computed: {% @3 b u% g! D) q; F0 F
fullname: function () {- U! [1 O0 }* z+ ` N
return this.firstName + ' ' + this.lastName;
8 t/ Z0 G0 |* {" D5 v }2 C \7 _+ m+ `: ~+ ?1 n
},+ _$ N5 b6 H5 Y9 t% Y! _
waTCh: {1 k, @8 t/ V3 _0 x; T
fullname: function () {
; F$ V9 V7 p- N$ L% y this.changeTime++;
0 V* m. M% e0 i. G" q }
: z# ?& o1 F- `7 g }
+ P! h) b4 P' Z, g# R6 @ }) t$ V, C% |" k5 ] x3 Z
)& {8 g3 c, c2 ^ R
</script>" n2 b% D# |) b6 T8 U- x* v
</body># C. Z1 d$ t) \
) P, a' Y* J" @/ @
</html>
! j a" {# j/ C% E: [( ]$ P" O! j; |7 ?6 Y/ s: K# _
0 w; R' ]; n# n+ s6 o% `' d: u
|
|
|小黑屋|手机版|PLM之家-企业数智化转型工业软件学习平台
