原 uni-fab悬浮按钮

版权声明：本文为博主原创文章，请尊重他人的劳动成果，转载请附上原文出处链接和本声明。
本文链接：https://www.91mszl.com/zhangwuji/article/details/1380

一：在view中添加uni-fab标签信息

<uni-fab
    :pattern="pattern"
    :horizontal="horizontal"
    :vertical="vertical"
    :direction="direction"
    @fabClick="addBtn">
</uni-fab>

二：在js中添加如下信息

export default {
    data() {
        return {
            pattern: { // 悬浮按钮
		buttonColor: '#6380E8'
	    },
	    horizontal: 'right', // 悬浮按钮: 水平对齐方式
	    vertical: 'bottom', // 悬浮按钮: 垂直对齐方式
	};
    }
}

三：页面效果，不论内容有多少，新增按钮一直都是悬浮的。

参考资料：

https://uniapp.dcloud.io/component/uniui/uni-fab.html