|
|
请使用QQ关联注册PLM之家，学习更多关于内容，更多精彩原创视频供你学习！
您需要 登录 才可以下载或查看，没有账号？注册
x
0 U* v6 g. U9 R/ TVuejs 挂载点 模板 实例和实例中的数据，事件和方法
$ g) l8 c8 y$ k6 P* g: {
8 w1 O6 T. X# P0 u9 d4 ]: R<!DOCTYPE html>% p" d1 X% X% i6 K- U8 \
<html lang="en">
. o; J% {4 v- B3 K% M% K<head>" n8 b" t& l, k$ E
<meta charset="UTF-8">
! d) a8 a2 I; W: Z4 n' ]; L <title>Vue start</title>5 Z& A V! w8 j# Z% J" X# X* k
<script src="./vue.js"></script>
: t% b/ n2 \8 e" V</head>, Z% O* k( ^3 c( `- |
# `- Q8 K5 [, ?6 {( E0 l& ]
<body>
( x& q. {" G6 F <div id="root">{{message}}
4 ~- N8 h+ G+ P) ` <h1 @click="changeword()">hello {{word}}</h1>1 i. L O# W9 R6 E) _7 E! z$ F3 |* U7 B! I
{{number}}
5 |1 Q& F5 ^% ?% W' z+ M+ Z <h1 v-text="number"></h1>
' ?8 C3 y# B- ]! F" R& i3 n, i& X <h1 v-html="content"></h1># i4 O- E1 e& G3 P) w) l) k
</div>+ B2 U, h7 c! o
<script>6 m8 m, d, ]! i; W5 X
new Vue({
% C5 N; A$ [& \. \2 I el: "#root",! L$ s Q" r3 L7 S) X# ]9 n( _
// template:"<h1>template can be here<h1>",9 z; ~$ v5 w/ ]
data: {
2 D# H4 \. L3 L. Y+ v, D- | message: 'hello world',
+ i0 g, l% a* Z( v0 A word:'plmhome',
% c O6 Y% f- _: i number: 123,# f4 S6 B, p4 y8 e+ R& a
content:"<h2>hello world<h2>"
3 u1 i" H, s! X) s" n },2 z+ T7 M+ W6 r' R1 G: `
methods: {
, p" R+ M% {6 r2 {* C changeword(){ a2 R' H( C: a$ L4 d# r- i
this.word = "plmhome.com" //change the word
- u% E: Q6 f' D- f3 M }
1 U. Y2 j, n5 V; [ }! B1 G. n9 a3 Q$ R& U0 i) o# m
})
* S7 r1 J3 i, y V, u- x& b </script>
& h5 ~# R9 z) }8 T
P# q2 \* L7 u$ v. U5 G</body>
7 C9 F; R" }# G: b. H+ b
" P8 z; G- h* ]" |# [( N8 _</html>+ C# d+ c# E% |2 I: F+ \ u
: l4 P3 n6 v4 c( ]& G. R6 E0 v+ L: O2 B+ q/ b; o$ J3 [+ e5 p% U% E
|
|
|小黑屋|PLM之家-专注工业软件生态建设，大模型CAD创新生态
( 沪ICP备2026005248号-1 )
发表于 2019-8-6 15:53:51
