uni-app中利用eacycom机制快速创建复用组件

组件：组成页面的零件

使用场景：复用性，利用参数实现差异变化

用法：uni-app具有eacycom机制，组件必须放在components文件夹下，就可以直接全局使用，而无需提前注册

1.创建components文件夹

右键components文件夹会跳出新建组件选项：

不同于一般文件夹：

2.创建组件

记得勾选"创建同名目录"：(为了满足eacycom机制)

3.应用举例

在components文件夹下创建了组件hello，在hello.vue文件中编写组件代码，其功能是接收传入的参数并以固定模式显示在屏幕上

//components/hello/hello.vue
<template><view><h2 :style="{ color: color }">Hello, {{ name }}</h2></view>
</template><script>
export default {//props: 接收通过属性传入的值，例如<hello name='bro!' color='green' />props: ['name', 'color'],name: 'hello',data() {return {};}
};
</script><style></style>

然后在pages文件夹中的index.vue中使用刚刚创建的hello组件：

//pages/index/index.vue
<template><view><view><hello name="bro" color="green" /></view><view><hello name="giegie" color="red" /></view><view><hello name="xiaoheizi" color="black" /></view></view>
</template><script>
export default {data() {return {};}
};
</script><style></style>

运行效果如图：

uni-app中利用eacycom机制快速创建复用组件相关推荐

ExtAspNet学习-利用AppBox框架快速创建项目（五）—完成项目含源代码
我们前边四个部分已经完成了框架需要的基础配置, 现在我们来完成项目 1.Subsonic 配置,首先在OraSurvey.DAO中添加App.config配置相关信息 View Code 1 < ...
uni app中使用图表
关于在uni app中运用图表今天写项目,需要在uni app中使用图表,我使用的是ucharts. 具体操作如下 1.下载 ucharts可以直接在uni app的插件市场下载安装. 先在插件市场 ...
猿创征文 | 开箱即用 yyg-cli：快速创建 vue3 组件库和vue3 全家桶项目
1 yyg-cli 是什么 yyg-cli 是优雅哥开发的快速创建 vue3 项目的脚手架.在 npm 上发布了两个月,11月1日进行了大升级,发布 1.1.0 版本:支持创建 vue3 全家桶项目和 ...
sql创建表主键gui_在SQL Server中使用主数据服务快速创建最终用户可以维护的GUI
sql创建表主键gui 介绍 ( Introduction ) Oft times we are forced into situations where we clearly need to thi ...
Java中利用package机制实现条件编译
Java中并没有C语言里的"条件编译"特性.这种特性在C语言里是用来解决代码的跨平台问题的,可以通过让代码的不同部分根据其运行的具体平台进行编译.由于Java本身就设计为一种跨平台 ...
码农之重学安卓：利用androidx.preference 快速创建一、二级设置菜单(demo)
文章目录卷首语谷歌API参考 1. 基本步骤 2. 创建一个AS项目,NoActivity 3. AS创建一级菜单的SettingsFragment 4. AS创建二级菜单的SettingsFra ...
利用Solid Edge快速创建模具型芯零件
在企业中,绝大多数零件都需要批量生产,这就需要为零件制作模具,而西门子的Solid Edge和CAM Express软件就为这一需求提供了非常便捷的解决方法. 首先,进入Solid Edge零件环境, ...
Python中利用FFT（快速傅里叶变换）进行频谱分析
本文将从实例的角度出发讲解fft函数的基本使用,不包含复杂的理论推导. 一.基本条件要对一个信号进行频谱分析,首先需要知道几个基本条件. 采样频率fs 信号长度N(信号的点数) 采样频率fs:根据采 ...
快速创建Angular组件并定义传参、绑定自定义事件的方法
为了方便创建Component,请自行安装插件接下来就是创建组件需要绑定入参in和事件out(用于输出参数) 运行效果如下(可以点击红色文字,就获取到了子组件传出的内容)

uni-app中利用eacycom机制快速创建复用组件

1.创建components文件夹

2.创建组件

3.应用举例

uni-app中利用eacycom机制快速创建复用组件相关推荐

最新文章

热门文章