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 1800 0

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

admin 楼主

2019-8-7 09:56:07

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

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

x
3 i/ ?8 w: q& q( B2 v8 m

' p9 C8 q/ |! x: ]8 y6 Y8 y: x
<!DOCTYPE html>
7 z# ]1 Q; [& G1 V<html lang="en">, A3 F( l2 B( M& ]
    <head>
7 T% G! `7 w- S6 W: G! d% K        <meta charset="UTF-8">; j% @% v# t. z" X
        <title>Vue JS V-show, v-for,v-if</title>
3 ~9 O2 {" y* F  j" w        <script src='./vue.js'></script>
6 b- z  ]1 L; B4 {; o; ]. F9 v3 p    </head>' i/ U/ S. J( \
    <body>' k: C/ d, [  }( v) e9 X
        <div id="root">. h, K  r# _! x! `' Y8 {
            <!-- v-if delete the dom
! ]% l+ w+ y: g8 a5 d% @            v-show just set the display:none -->2 M4 I5 e/ Z! A  T
           <div v-if="show">hello plmhome</div>
- f1 T9 k( v' C# X/ q6 ]/ K, y           <button @click="toggle">toggle to display</button>- Y1 n% [) n1 D; ?

- Y/ A& O% `4 j2 n4 Z           <ul>
* y4 |# p2 A1 C* A8 R3 ^                <li v-for="(item,index) in list" :key="index">{{item}}</li>
1 ^) G" c7 H9 J" O1 f            </ul>
& Y+ Y1 X7 k* }; e9 [  `# l
# h( {, u/ ^  p: y7 E5 O        </div>
# h; I$ l4 o! g' v$ v
) e$ I# G! q8 {' I( \7 B. _  U4 ~" j$ U
        <script>: t. u- w1 J, `/ Y6 I
        new Vue({+ G  {1 n: N+ y% d- y6 V
            el: "#root",1 q. H5 x9 j  @2 A
            data:{
- s& e  Z& d* e8 o* r                show: true,2 K1 n0 {% O- v
                list:['plm','home','I','love','you']
) V) A# @0 x5 o7 M$ g5 e$ J            },9 F' k  G9 ~* [5 }, ]0 K2 I7 y( \
            methods:{
: H5 i8 U) {1 {2 d               toggle:function(){; d  G& j& H1 H/ }
                   this.show = !this.show;
, u  |5 k! l8 d9 w5 I* ?               }
* `/ h; g7 x" O' R- o4 J- ?            }
+ Q& g9 a  h5 `( c1 \6 U( x        })
0 c: x2 @7 s! ]- s9 I        </script>
( L6 l3 X6 O, p$ ^! d8 t* O    </body>! q8 k1 V3 M+ v
</html>
- \1 P9 E4 p9 C# i4 S

3 }: {( j, N5 ^, L* |2 m4 U. [9 I: W7 Z
上海点团信息科技有限公司,承接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二次开发专题模块培训报名开始啦

    我知道了