PLM之家精品课程培训,联系电话:18301858168 QQ: 939801026

  • NX二次开培训

    NX二次开培训

    适合初级入门或想深入了解二次开发的工程师,本培训结合ufun,NXOpen C++,大量的实例及官方内部的开发技术对于老鸟也值得借鉴!.

    NX CAM二次开发培训报名 NX二次开发基础培训报名
  • PLM之家Catia CAA二次开发培训

    Catia二次开发培训

    Catia二次开发的市场大,这方面开发人才少,难度大。所以只要你掌握了开发,那么潜力巨大,随着时间的积累,你必将有所用武之地!

  • PLM之Teamcenter最佳学习方案

    Teamcenter培训

    用户应用基础培训,管理员基础培训,管理员高级培训,二次开发培训应有尽有,只要你感兴趣肯学习,专业多年经验大师级打造!

  • PLM之Tecnomatix制造领域培训

    Tecnomatix培训

    想了解制造领域数字化吗?想了解工厂,生产线设计吗?数字化双胞胎,工业4.0吗?我们的课程虚位以待!

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

[前端框架] VueJs V-show,v-if and v-for

[复制链接]

2019-8-7 09:56:07 1725 0

admin 发表于 2019-8-7 09:56:07 |阅读模式

admin 楼主

2019-8-7 09:56:07

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

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

x

& y5 ^$ D+ X' s( j9 l
' g/ H7 x( F: P5 I; d8 B
; e0 i7 W1 k& S8 |<!DOCTYPE html>0 Z! }1 S# x# `) B' s
<html lang="en">
6 H  [+ Y" }$ N5 {1 k    <head>* p% G) K5 \5 V# k! m, P
        <meta charset="UTF-8">
) E+ n1 W$ C& N) k- `& S8 `        <title>Vue JS V-show, v-for,v-if</title>
0 c/ B) Z+ j# m0 U4 f# K9 }        <script src='./vue.js'></script>
5 s) {, I9 w) t3 w    </head>2 Z3 q% |; Q. M! c
    <body>
/ {* x$ d& R1 e9 E  p: R, \. @1 q        <div id="root"># z* N% a2 o  o3 w& w3 [; _, `
            <!-- v-if delete the dom
% F9 l3 d! Y! g7 I, e1 u            v-show just set the display:none -->
* A; ~( W6 k3 b8 U           <div v-if="show">hello plmhome</div>
+ b: z1 [8 y" `. j           <button @click="toggle">toggle to display</button>
; l; C) ^) P/ {& ?& D, v  ?4 }
9 ~( J! O2 }0 N           <ul>+ l# j9 A9 H9 Q! Y5 f: o- H7 O2 U+ A
                <li v-for="(item,index) in list" :key="index">{{item}}</li>
# _* i1 M2 i2 g# M            </ul>
7 K& A3 Y8 x6 t+ I9 m: C  n6 x/ ]6 q0 z# J5 o
        </div>
& }0 \. x$ u; s/ V) Q. o! y! s6 e% k
( L. S7 F! b" K9 v7 \5 T
        <script>
$ {7 _- Z' j6 |9 L3 q4 f        new Vue({
# x; A! }; E- i            el: "#root",3 I% o3 |) c: Z) ]' c
            data:{
" U- J, k0 t+ C, i' Y  G                show: true,6 F! C" q2 [( _) T& ^" D
                list:['plm','home','I','love','you']* m" j/ f. \# d# V
            },
9 H. M! W1 B* Z+ A            methods:{' M& l$ s+ {# F2 H' X
               toggle:function(){# p( c  O1 e$ D0 G8 x
                   this.show = !this.show;
: s$ f! ?* r" X& S" l9 v  C! d# Y3 ^" K               }* `( i, `, z7 ?( ^4 C4 q: c! A
            }0 a9 Y9 N% Q! F" E+ Y- J
        })7 s# f- I, \2 M
        </script>) x/ a: m/ @$ ~. F4 c& i7 q
    </body>4 \8 n0 c. t7 h. M+ V9 a
</html>
7 G1 `& s; m! @, G

! i% ]9 i4 Y& n) ~$ q( X: s5 F& a( i- B1 T; a2 u/ `0 c
上海点团信息科技有限公司,承接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二次开发专题模块培训报名开始啦

    我知道了