|
|
请使用QQ关联注册PLM之家，学习更多关于内容，更多精彩原创视频供你学习！
您需要 登录 才可以下载或查看，没有账号？注册
x
8 ^. B6 A: D: b/ b; U9 h* H( OVuejs 挂载点 模板 实例和实例中的数据，事件和方法) v7 l! ]( b' R1 A
2 ?4 ~6 _7 V6 a- n( n( D# Z<!DOCTYPE html>; F$ w& m `3 v( O0 Y
<html lang="en">
$ p8 V5 F* f5 I" W& y<head># u9 r: c- I4 x
<meta charset="UTF-8">
2 g( c. u, X7 H- o A <title>Vue start</title>
$ {1 I: z! @- ^/ m <script src="./vue.js"></script>
8 U! R+ u' n: r$ F0 L</head>
: G) w0 ~& D e' t- s! h0 f7 Z' }* `: {: Y* k6 C1 W5 P
<body>
) i' G( [! N n. @* ` k <div id="root">{{message}}
% \- w$ Z( P+ P3 {% y; | <h1 @click="changeword()">hello {{word}}</h1> N" f* h5 s8 L
{{number}}2 S* r8 {2 F& T/ p6 p* ` ]% @/ g1 }
<h1 v-text="number"></h1>
8 M6 ]3 X# d- C3 Y! p. l. D <h1 v-html="content"></h1>
. ]2 Y7 Z( |, V4 R) \8 m1 f </div>+ O, k/ o' E( S8 S3 G( d
<script>; [1 d9 t; w2 R1 [9 b
new Vue({
. d' R, s& `) V# n% Z5 s1 z el: "#root",' Y0 U; @: o: Q4 V$ E" y
// template:"<h1>template can be here<h1>",
! ]( s$ L5 }2 `5 D {+ V data: {# H, r |* A- V8 M/ X
message: 'hello world',+ ?& N. w+ u% y' c
word:'plmhome'," E! z! w! |- u- j1 c( |6 h
number: 123,4 X0 R! }/ E4 g+ p, g f0 O0 ]& i: e
content:"<h2>hello world<h2>"" J& ?( U- D. b! n
},3 H# c3 ^0 y, V" s7 `
methods: {
2 i5 |: B- \3 U a3 `5 G7 e" s changeword(){& X' c5 S$ K8 g/ E5 Z
this.word = "plmhome.com" //change the word
8 i2 k2 J( U- }$ t4 l3 _ }4 R+ b+ _" `; d- q5 a, q1 i
}
2 F+ s! z, M. X0 L. Q- u })- F1 L1 G( f( k+ W
</script>6 ` d. b* i/ A
4 `- _ d2 t6 Q! ~$ P: `9 y</body>( K. P% [* ^5 T0 J
4 I: |, i: T7 t8 y+ m9 P</html>
; c/ s7 ?' f9 Y. a3 N, v \8 z6 Z0 G4 k' r% s" n. S
) M8 j4 w( X3 h x1 U7 L5 p! V8 A
|
|
|小黑屋|PLM之家-专注工业软件生态建设，大模型CAD创新生态
发表于 2019-8-6 15:53:51
