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

[前端框架] Vuejs 挂载点 模板 实例和实例中的数据,事件和方法

[复制链接]

2019-8-6 15:53:51 1673 0

admin 发表于 2019-8-6 15:53:51 |阅读模式

admin 楼主

2019-8-6 15:53:51

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

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

x
& t6 Z8 v7 \( Q& ^2 W
Vuejs 挂载点 模板 实例和实例中的数据,事件和方法4 R7 v, E1 V; s% K# O, p( T* _

% B3 m* \: ]. K- D  e6 @8 I<!DOCTYPE html>; O. k) B+ I, D% d
<html lang="en">$ E7 i0 ]* `5 R" q! h
<head>
% D; y# d# K% I* g    <meta charset="UTF-8">
1 n" \6 O+ w: ^    <title>Vue start</title>
! q7 \: S# b+ M' t7 c9 H    <script src="./vue.js"></script>, ]& K" x: X- M8 U$ [
</head>
% `- N$ R' G% i; t% t+ n0 {: Y8 G/ Z# |
<body>
+ M8 _1 }! P  R1 e3 W    <div id="root">{{message}}8 J) ]$ w' G( o  f
        <h1 @click="changeword()">hello {{word}}</h1>+ o$ U, ^2 r2 f. P
        {{number}}
! {: O% b( l9 M. r" ^: a        <h1 v-text="number"></h1>
+ B' |- w, }! C) I$ o' e3 V        <h1 v-html="content"></h1>3 \6 K" Z1 L2 o& I1 m% M& h. P. d
    </div>8 H$ C8 g" C- B9 `; H1 J9 @
    <script>
& I& q/ U" D, e3 n        new Vue({
4 i) [' ~* a4 w4 _* [            el: "#root",+ x- E6 Y6 N3 u8 T+ O
            // template:"<h1>template can be here<h1>",
5 h+ e. R- M; O; H: C/ P8 {            data: {
: ]' F" c- L, r5 Q                message: 'hello world',
9 v0 k/ O* [2 s$ ~- T7 ~                word:'plmhome',% k9 Q) O2 @6 L. L
                number: 123,
' v/ @- f; B+ d                content:"<h2>hello world<h2>"
  T% e4 @2 ?% h# e8 C# a            },; c+ K) L9 C% V2 @; H# v. y
            methods: {
. o1 \& M; h5 \1 D. @2 j                changeword(){8 r) G+ H$ d" h$ W3 ]5 A* t! s
                   this.word = "plmhome.com" //change the word
  O: [* n1 ~8 X! A5 V2 ?# h( J" [' k                }4 V- N7 @0 ~( a/ `& Q2 h
            }! `9 }9 f' N; o5 N& A
        })$ \& W, E9 f" h! F
    </script>
( S& r% m# Z8 [; ]* |% f/ n) \% B! x
</body>8 N" ]% R' e# T+ n. H5 o. m& V4 z
9 K! X" l$ f7 i, J& w8 g6 ~/ C
</html>
, ^) ]+ |7 u: L1 A9 m

" H; k9 A0 H4 W4 B% D
( V6 G# L, R) @# t4 r$ [
上海点团信息科技有限公司,承接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二次开发专题模块培训报名开始啦

    我知道了