返回发烧友论坛
发 帖  

[文章]HarmonyOS应用开发-显示开关功能与界面的实现

李洋水蛟龙
2022-05-06 14:37:09
阅读量0
HarmonyOS
1
2

一．创建项目
二．代码示例
hml
  1. <div class="container">
  2.     <text class="title">一段话是否显示：</text>
  3.     <switch checked="false" @change="switchChange"></switch>
  4.     <text class="txt" show="{{ isShow }}">{{txt}}</text>
  5. </div>
复制代码
CSS
  1. CSS.container {
  2.     flex-direction: column;
  3.     justify-content: center;
  4.     align-items: flex-start;
  5. }

  7. .title {
  8.     font-size:20px;
  9.     margin: 20px 0px 10px 15px;
  10. }
  11. .txt{
  12.     font-size: 16px;
  13. }
复制代码
Js
  1. import prompt from '@system.prompt';
  2. export default {
  3.     data: {
  4.         isShow:false,
  5.         txt:'　是夜，静悄悄，万物无声。风，淡淡的吹来，带着一丝的凉意。夏的炎热在夜晚消失无踪。仰望天空，天边几颗星子，点缀着夜幕。脚下，每天走着的小路，在今天犹独的寂静，寂静得美丽。"　喜欢这样的夜晚，月光如水般的流泻。当喧嚣隐入静寂，灵动的清风牵引倦怠的心流连在杨柳岸边，飘飞，如风飞扬。'
  6.     },
  7.     switchChange(e){
  8.         this.isShow = !this.isShow
  9.     }
  10. }
复制代码
三．效果示例

附件：
HarmonyOS应用开发-显示开关功能与界面的实现.docx
(79.49 KB, 下载次数: 0)




举报

回帖

声明：本文内容及配图由入驻作者撰写或者入驻合作网站授权转载。文章观点仅代表作者本人，不代表电子发烧友网立场。文章及其配图仅供工程师学习之用，如有内容图片侵权或者其他问题，请联系本站作侵删。 侵权投诉
链接复制成功，分享给好友