uni-app开发 经验和技巧总结

CuterCorley
• 阅读 1705

前言

uni-app 是一个基于 Vue.js 开发所有前端应用的框架,开发者编写一套代码,可发布到iOS、Android、Web(响应式)、以及各种小程序(微信/支付宝/百度/头条/QQ/钉钉/淘宝)、快应用等多个平台。 在开发过程中可能会用到一些经验和技巧,可以加速开发,归纳如下。

1.自定义组件模板

在开发时,很多情况下需要自定义组件,在自定义组件时,可以使用HBuilderX提供的模板,包括默认模板、使用less的组件等,但是因为一般在自定义模板时需要定义name、props等,而这些组件中并未包含该属性,因此可以自定义模板。 点击创建组件窗口右上角的自定义模板,如下: uni-app开发 经验和技巧总结 在弹出的目录中创建模板名.txt,里边写入模板内容即可,例如创建带有属性的模板.txt如下:

<template name="组件名称">
    <view>
        ......
    </view>
</template>
<script>
    export default {
        name: "组件名称",
        //属性
        props: {
            属性名称: {
                type: String, //属性类型
                value: "值"
            },
            ......
        },
        //组件生命周期
        created: function(e) {

        },
        methods: {
            函数名称: function(obj) {

            },
        }
    }
</script>
<style>
    **组件样式**
</style>

保存后,即可在创建组件时选择该模板。

本文原文首发来自博客专栏移动应用开发,由本人转发至https://www.helloworld.net/p/jYP7sJQu6bF5Z,其他平台均属侵权,可点击https://blog.csdn.net/CUFEECR/article/details/112618827查看原文,也可点击https://blog.csdn.net/CUFEECR浏览更多优质原创内容。

点赞
收藏
评论区
推荐文章
CuterCorley CuterCorley
3年前
uni-app开发 常见异常和解决办法
前言uniapp是一个基于Vue.js开发所有前端应用的框架,开发者编写一套代码,可发布到iOS、Android、Web(响应式)、以及各种小程序(微信/支付宝/百度/头条/QQ/钉钉/淘宝)、快应用等多个平台。在开发过程中可能会遇到一些异常,这些异常及其解决办法总结如下。1.调用微信开发者工具报错IDEserviceportdis
CuterCorley CuterCorley
3年前
uni-app入门教程(1)uni-app简介、部署和目录结构
@toc前言本文主要介绍了uniapp的基本情况,并引导快速创建和运行第一个uniapp项目,同时对项目的目录结构和代码规范进行详细说明,适合uniapp零基础初学者。一、uniapp介绍uniapp是DCloud官方推出的重要产品,是一个使用Vue.js开发跨平台应用的前端框架,官网是。开发者通过编写一套Vue.js代码,即可
Alex799 Alex799
3年前
5款vue前端UI框架
Vue.js是一套构建用户界面的渐进式框架。与其他重量级框架不同的是,Vue采用自底向上增量开发的设计。实用的Vue.js组件库可以帮助我们快速搭建页面,下面介绍小编认为比较受欢迎的五个vue前端ui框架。TOP5——VueBluVueBlu是基于Vuejs和Bulma开发的开源UI组件库。旨在为PC端的前端开发(特别是中后台产品)提供一个快速且灵
马丁路德 马丁路德
3年前
推荐几个微信小程序开发小技巧
前段时间在下开发了个微信小程序,开发过程中总结了一些我觉得对我有用的小技巧,提炼出来,相当于一个总结复盘,也希望可以帮助到大家。如果对大家确实有帮助,别忘了点赞哦🌟~1\.开发中可能遇到的坑以及Tips本来想写个小技巧的,结果我总结了一堆坑,没上手之前完全想象不到微信小程序的开发体验是如此之差、如此之烂,从微信
Easter79 Easter79
2年前
Taro小程序自定义顶部导航栏
微信自带的顶部导航栏是无法支持自定义icon和增加元素的,在开发小程序的时候自带的根本满足不了需求,分享一个封装好的组件,支持自定义icon、扩展dom,适配安卓、ios、h5,全面屏。我用的是京东的Taro多端编译框架写的小程序,原生的也可以适用,用到的微信/taro的api做调整就行,实现效果如下。!在这里插入图片描述(https://i
臧霸 臧霸
1个月前
uni-app实战在线教育类app开发
uniapp是一个跨平台的开发框架,可以在多个移动端平台(如iOS、Android等)上使用一套代码进行开发。通过使用uniapp,您可以使用Vue.js编写代码,并将其打包为原生应用,以实现在线教育类app的开发。以下是使用uniapp实战开发在线教育类
京东云开发者 京东云开发者
7个月前
京东小程序平台助力快送实现跨端 | 京东云技术团队
前言:京东小程序开放平台是由京东自主研发的开发者开放平台,类似于微信和支付宝的小程序开放平台,提供了丰富的开放能力和完整的小程序开发生命周期所需的功能。开发者可以轻松地使用开发者工具IDE进行开发、调试、预览和代码转换,并在控制台进行线上小程序发布、审核、
何婆子 何婆子
3个月前
2023最新版-Web前端架构师(35周完结无密)
2023最新版Web前端架构师(35周完结无密)download》chaoxingit.com/2489/Web前端架构师是负责设计和构建大型Web应用程序的前端开发人员。他们通常具有丰富的Web开发经验和深入的技术知识,能够与团队成员合作,以实现高效、可
金旋 金旋
3个月前
扫码点餐微信小程序云开发,uniapp,vue,nodejs带后台管理
//下仔のke:https://yeziit.cn/13619/UniApp是一个使用Vue.js开发所有前端应用的框架,开发者编写一套代码,可发布到iOS、Android、H5,以及各种小程序(微信/支付宝/百度/头条/QQ/钉钉)等多个平台,方便开发者
linbojue linbojue
2个月前
SpringBoot2.X+Vue+UniAPP,全栈开发医疗小程序
开发医疗小程序的技术选型和开发流程在开发医疗小程序时,可以根据具体需求和项目规模选择合适的技术选型。以下是一些常用的技术选项:前端开发:医疗小程序的前端开发可以使用基于HTML、CSS和JavaScript的框架和库,如Vue.js、React.js和An