如何帮悬浮小球添加点击事件

问题遇到的现象和发生背景

uni-app一个悬浮小球是按着官方文档写的

用代码块功能插入代码，请勿粘贴截图

<!-- 浮动球 -->
        <movable-area class="movable-area">
            <movable-view class="movable-view" :x="x" :y="y" direction="all">
                <uni-fab ref="fab" :content="content" @trigger="trigger" @fabClick="fabClick" :icon="icon" />
            </movable-view>
        </movable-area>

    </view>
</template>
<script>
    export default {
        data() {
            return {
                searchValue: '',

                list: [{
                        url: '../../static/c1.png',
                        text: 'grid1',
                        badge: '0',
                        type: "primary",


                    },
                    {
                        url: '../../static/c2.png',
                        text: 'grid2',
                        badge: '1',
                        type: "success"
                    },
                    {
                        url: '../../static/c3.png',
                        text: 'grid3',
                        badge: '1',
                        type: "success"
                    },
                    {
                        url: '../../static/c4.png',
                        text: 'grid4',
                        badge: '1',
                        type: "success"
                    },
                ],
                icon: {
                    type: String,
                    default: 'plusempty'
                },
                content: [{
                        iconPath: '/static/reading.png',
                        selectedIconPath: '/static/reading.png',
                        text: '阅读',
                        active: true,
                        path: '../index/index'

                    },
                    {
                        iconPath: '/static/预约.png',
                        selectedIconPath: '/static/预约.png',
                        text: '预约',
                        active: false,

                    },
                    {
                        iconPath: '/static/talking.png',
                        selectedIconPath: '/static/talking.png',
                        text: '通讯',
                        active: false,

                    },
                ],
                // 可移动的fab
                x: 20, //x坐标
                y: 520, //y坐标
            }
        },

运行结果及报错内容

这个是页面实现的效果

我的解答思路和尝试过的方法

想着给他添加一个点击事件，但是由于自己刚学习不会这一类，基础也很差，不知道该怎么写，想着应该是用for循环遍历，但是不知道该怎么弄。

我想要达到的结果

想给每个图标都添加点击事件直接跳转到相对应的地方

<script>
    export default {
        components: {},
        data() {
            return {
                title: 'uni-fab',
                directionStr: '垂直',
                horizontal: 'left',
                vertical: 'bottom',
                direction: 'horizontal',
                pattern: {
                    color: '#7A7E83',
                    backgroundColor: '#fff',
                    selectedColor: '#007AFF',
                    buttonColor: '#007AFF',
                    iconColor: '#fff'
                },
                is_color_type: false,
                content: [{
                        iconPath: '/static/image.png',
                        selectedIconPath: '/static/image-active.png',
                        text: '相册',
                        active: false
                    },
                    {
                        iconPath: '/static/home.png',
                        selectedIconPath: '/static/home-active.png',
                        text: '首页',
                        active: false
                    },
                    {
                        iconPath: '/static/star.png',
                        selectedIconPath: '/static/star-active.png',
                        text: '收藏',
                        active: false
                    }
                ]
            }
        },
        onBackPress() {
            if (this.$refs.fab.isShow) {
                this.$refs.fab.close()
                return true
            }
            return false
        },
        methods: {
            trigger(e) {
                console.log(e)
                this.content[e.index].active = !e.item.active
                uni.showModal({
                    title: '提示',
                    content: `您${this.content[e.index].active ? '选中了' : '取消了'}${e.item.text}`,
                    success: function(res) {
                        if (res.confirm) {
                            console.log('用户点击确定')
                        } else if (res.cancel) {
                            console.log('用户点击取消')
                        }
                    }
                })
            },
            fabClick() {
                uni.showToast({
                    title: '点击了悬浮按钮',
                    icon: 'none'
                })
            },
            switchBtn(hor, ver) {
                if (hor === 0) {
                    this.direction = this.direction === 'horizontal' ? 'vertical' : 'horizontal'
                    this.directionStr = this.direction === 'horizontal' ? '垂直' : '水平'
                } else {
                    this.horizontal = hor
                    this.vertical = ver
                }
                this.$forceUpdate()
            },
            switchColor() {
                this.is_color_type = !this.is_color_type
                if (this.is_color_type) {
                    this.pattern.iconColor = '#aaa'
                    this.pattern.buttonColor = '#fff'
                } else {
                    this.pattern.iconColor = '#fff'
                    this.pattern.buttonColor = '#007AFF'
                }
            }
        }
    }
</script>