更新记录

1.0.1（2024-08-05） 下载此版本

innovueui-popup 从下往上 弹出层

1.0.0（2024-08-05） 下载此版本

innovueui-popup 从下往上 弹出层

平台兼容性

innovueui-popup 从下往上弹出层

uni-popup 弹出层 组件名：uni-popup

代码块： uPopup 关联组件：uni-popup-dialog,uni-popup-message,uni-popup-share,uni-transition

uni-popup 弹出层

弹出层组件，在应用中弹出一个消息提示窗口、提示框等

index.vue

<template>
    <view class="content">

        <button type="primary" class="button1"
            @click="showPopup()">弹出popup</button>   

        <innovueui-popup ref="popup"></innovueui-popup>

    </view>
</template>

<script>

    export default {

        data() {
            return {

            }
        },
        onLoad() {

        },
        methods: {
            showPopup(){
                this.$refs.popup.open('bottom')
            }
        }
    }
</script>

<style>
    .content {
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
    }
    .button1{
        width: 240px; height: 38px;line-height: 38px; font-size:15px;
        margin-top:20px;
    }
</style>

uni_modules 模块说明

uni_modules不需要再导入组件

uni_modules是uni-app框架中用于实现模块化开发的功能。在uni_modules中，你不需要像传统方式那样手动引入组件，而是可以直接在页面中使用。这是因为uni_modules内部定义了一套自动化的模块化机制，使得模块可以自动注册并在需要的时候被调用。

以下是一个简单的例子，展示了如何在uni_modules中使用组件：

首先，在components目录下创建一个名为my-component.vue的组件：

<template>
  <view>
    <text>这是一个自定义组件</text>
  </view>
</template>

<script>
export default {
  name: 'MyComponent'
  // 其他选项...
}
</script>
然后，在pages目录下的页面文件中直接使用这个组件，无需导入：

<template>
  <view>
    <my-component></my-component>
  </view>
</template>

<script>
export default {
  // 页面的其他配置...
}
</script>

在上述例子中，我们直接在页面模板中使用了，而没有导入组件。这是因为uni_modules内部机制会自动识别并注册在components目录下定义的组件，使得我们可以在页面中直接使用它们。