uni-app课程心得体会以及编程思路

 一.心得体会   

  1.uniapp具有跨平台的特性，可以使用同样的代码在多个平台（如H5、小程序、App）上进行开发，极大地提高了开发效率和代码复用率。这也意味着在开发时，可以快速地经过调试和测试，在不同平台上发布应用程序，加快开发和部署的速度。

   2.uniapp提供了丰富的组件库和插件，可以轻松地创建各种界面和交互元素，如图标、弹出框、下拉刷新等等，可以满足开发需求，加快开发进度，提高开发效率。而且，uniapp具有灵活的扩展性，可以自定义组件和插件，满足开发中的特殊需求。

3.uniapp提供了完善的文档和社区支持，可以很容易地获取使用说明、示例代码、常见问题解答等帮助信息，并且可以在开发过程中获取社区的支持和帮助。这些文档和社区资源，可以让开发者更好地理解和掌握uniapp的使用方法和技巧。

   uniapp的跨平台特性、丰富的组件库和插件、完善的文档和社区支持，都为开发提供了非常良好的开发环境和体验，是一个非常优秀的前端开发框架。

1.Uniapp是基于vue.js的跨平台开发框架，学习 UniApp 需要先掌握 Vue.js 的基础知识。主要包括 Vue.js 的生命周期、数据绑定、组件、指令等概念。通过本学期uniapp的学习巩固了前端Vue.js框架的知识。
2.UniApp 的主要特点之一就是跨平台开发能力，在开发过程中要考虑到不同平台的差异，比如uploadFile方法的多文件上传参数files在app端和H5端能使用而在微信小程序端就不支持多文件上传无法使用files参数。如下代码所示
              

  uni.uploadFile({
                    files:files,
                    formData:{
                        "content":this.commentContent,
                        "productId":productId
                    },

3.在学习过程中通过查找官方文档解决学习中遇到的一些问题，有效地提高了自学能力。
4.UniApp 推崇的是组件化思想，这种思想可以帮助我们将一个复杂的应用程序分解成多个独立的组件，使得开发、测试和维护更加容易。同时，组件化思想也可以促进代码的复用和协作，提高开发效率。

5.在学习uniapp的重要部分组件时，我们需要考虑到组件的可复用性和扩展性，尽量将组件的样式和行为封装起来，使得组件的使用更加简单和方便。同时，我们需要将组件的可配置项尽量抽象出来，以方便未来的扩展和修改。在设计组件时还要考虑到全局和局部，UniApp 组件的样式可以使用全局样式和局部样式，我们需要根据组件的使用情况和需求来设计样式，尽量使得组件的样式和整个应用的样式保持一致，同时也需要考虑到组件的局部样式和全局样式之间的优先级关系。

6.页面路由跳转

页面路由是指不同页面之间的跳转和切换。在 Uniapp 中，我们可以通过编写代码来实现页面的跳转，比如通过点击按钮或者链接来触发跳转。

在 Uniapp 中，页面路由有两种模式：uni-app 和 vue-router。uni-app 是官方提供的路由模式，其特点是简单易用，适合快速开发。vue-router 则是基于 Vue.js 的路由模式，更加灵活和强大，适合复杂应用程序的开发。 在编写页面路由的过程中，需要注意页面的生命周期。在页面跳转时，当前页面的生命周期会被触发，可以在生命周期函数中处理一些逻辑，比如清理数据或者保存状态。 在页面路由的实现中，还需要注意一些常见问题，比如页面参数的传递、路由的嵌套和重定向等。这些问题都可以通过学习文档和实践来解决。 7.在实现页面通知的过程中有自定义消息中心和通过getCurrentPages()获取页面对象来实现不同页面之间的通信。自定义消息中心能够在不同页面之间实现消息传递从而实现页面之间的通信。而getCurrentPages()方法是通过获取当前页面栈的所有页面实例，并通过获取的所有栈中获取需要通信的页面。这就受到页面打开顺序的影响，而消息通知中心能够更加随心所欲的进行不同页面之间的消息传递。 以下为消息通知中心实现代码

//1.用数组保存所有注册的通知（包含名称、要执行的代码、观察者）

let notices = [];
/**
 * 2.注册通知到通知中心
 * @param {String} name 消息名称
 * @param {Function} selector 对应的通知函数
 * @param {Object} observer 观察者
 */
function add(name,selector,observer){
    notices.push({
        name: name,
        selector: selector,
        observer: observer,
    })
}

/**
 * 3.通知成功移除消息
 * @param {String} name 消息名称
 * @param {Ob