鸿蒙2.0!用 JavaScript 开发鸿蒙应用

简介: 鸿蒙2.0!用 JavaScript 开发鸿蒙应用

去年虽然发布了鸿蒙操作系统,但是并没有放出任何开发文档,导致鸿蒙系统在很长一段时间都被喷得很惨,甚至大家一致认为这是一个骗局,好在今年这一现象得到了改观。在 CSDN 社区里,有了鸿蒙应用的开发介绍。这也是我作为一个大前端开发者最关注的东西,鸿蒙应用到底使用的什么语言开发应用?

image.png

image.png


读了文档之后,我发现了一个值得所有前端小伙伴们开心的事情,鸿蒙应用的技术栈是JavaScript + HTML + css

image.png

例如开发一个这样的界面

image.png

image.png


部分代码如下:

<todo-header title="今日" type="" @add-event="toAddEvent('today')"></todo-header>
<list-item id="item{{$item.id}}" for="{{todolist}}" class="tag-list-item" clickeffect="false">
   <todo-list todo="{{$item}}" todos="{{todolist}}" index="{{$idx}}"></todo-list>
</list-item>
// 完成任务
completeEvent(clicked) {
    var key = clicked.detail.key;
    if (!(key['type'] == 'click' || key[0].code == 22)) {
      return;
    }
    var lists = clicked.detail.lists;
    var eid = clicked.detail.id;
    /*完成事项的动画*/
    for (var i in lists) {
      if (lists[i].id == eid) {
        if (lists[i].checkbtn == "/common/done.png") {
          lists[i].checkbtn = "/common/checkbutton.png";
          lists[i].showtag = '';
          lists[i].color = 'text-default';
          lists[i].lineclz = false;
        } else {
          lists[i].checkbtn = "/common/done.png";
          lists[i].showtag = 'hide';
          lists[i].color = 'text-gray';
          lists[i].lineclz = true;
        }
        break;
      }
    }
    this.updateStorage();
  },


完整的开发体验,还需要进一步上手尝试了之后才能跟大家分享。

相关文章
|
1天前
「Mac畅玩鸿蒙与硬件42」UI互动应用篇19 - 数字键盘应用
本篇将带你实现一个数字键盘应用,支持用户通过点击数字键输入数字并实时更新显示内容。我们将展示如何使用按钮组件和状态管理来实现一个简洁且实用的数字键盘。
34 16
「Mac畅玩鸿蒙与硬件42」UI互动应用篇19 - 数字键盘应用
|
15天前
|
存储 数据安全/隐私保护
鸿蒙开发:自定义一个动态输入框
在鸿蒙开发中,如何实现这一效果呢,最重要的解决两个问题,第一个问题是,如何在上一个输入框输入完之后,焦点切换至下一个输入框中,第二个问题是,如何禁止已经输入的输入框的焦点,两个问题解决完之后,其他的就很是简单了。
43 13
鸿蒙开发:自定义一个动态输入框
|
13天前
|
存储 缓存 监控
如何使用内存监控工具来优化 Node.js 应用的性能
需要注意的是,不同的内存监控工具可能具有不同的功能和特点,在使用时需要根据具体工具的要求和操作指南进行正确使用和分析。
59 31
|
8天前
|
Web App开发 JavaScript 前端开发
Node.js开发
Node.js开发
25 13
|
15天前
|
存储 JavaScript 前端开发
深入浅出Node.js后端开发
在数字化时代的浪潮中,后端开发作为连接用户与数据的桥梁,扮演着至关重要的角色。本文将以Node.js为例,深入探讨其背后的哲学思想、核心特性以及在实际项目中的应用,旨在为读者揭示Node.js如何优雅地处理高并发请求,并通过实践案例加深理解。无论你是初学者还是有一定经验的开发者,这篇文章都将为你提供新的视角和思考。
|
12天前
|
Web App开发 开发框架 JavaScript
深入浅出Node.js后端开发
本文将带你领略Node.js的魅力,从基础概念到实践应用,一步步深入理解并掌握Node.js在后端开发中的运用。我们将通过实例学习如何搭建一个基本的Web服务,探讨Node.js的事件驱动和非阻塞I/O模型,以及如何利用其强大的生态系统进行高效的后端开发。无论你是前端开发者还是后端新手,这篇文章都会为你打开一扇通往全栈开发的大门。
|
15天前
|
Web App开发 开发框架 JavaScript
深入浅出Node.js后端开发
在这篇文章中,我们将一起探索Node.js的奇妙世界。无论你是刚接触后端开发的新手,还是希望深化理解的老手,这篇文章都适合你。我们将从基础概念开始,逐步深入到实际应用,最后通过一个代码示例来巩固所学知识。让我们一起开启这段旅程吧!
|
11天前
|
Web App开发 JavaScript 前端开发
深入浅出Node.js后端开发
本文将带领读者从零基础开始,一步步深入到Node.js后端开发的精髓。我们将通过通俗易懂的语言和实际代码示例,探索Node.js的强大功能及其在现代Web开发中的应用。无论你是初学者还是有一定经验的开发者,这篇文章都将为你提供新的见解和技巧,让你的后端开发技能更上一层楼。
|
14天前
|
JavaScript 前端开发 API
深入理解Node.js事件循环及其在后端开发中的应用
本文旨在揭示Node.js的核心特性之一——事件循环,并探讨其对后端开发实践的深远影响。通过剖析事件循环的工作原理和关键组件,我们不仅能够更好地理解Node.js的非阻塞I/O模型,还能学会如何优化我们的后端应用以提高性能和响应能力。文章将结合实例分析事件循环在处理大量并发请求时的优势,以及如何避免常见的编程陷阱,从而为读者提供从理论到实践的全面指导。
|
13天前
|
JavaScript
如何使用内存快照分析工具来分析Node.js应用的内存问题?
需要注意的是,不同的内存快照分析工具可能具有不同的功能和操作方式,在使用时需要根据具体工具的说明和特点进行灵活运用。
35 3