请教两个vue界面如何共用一个js

分类：uni-app

uniapp

请教两个界面如何共用一个逻辑代码：
1、界面 index-mobile.vue 用于手机显示 index-pad.vue 用于平板显示
2、我想这两个界面共用 index.js 代码，上面两个vue只处理界面显示

能实现吗？如果是html的方式就很简单，uniapp里面就不知道如何实现。

2023-10-25 17:40 负责人:无分享

3 个回复

爱豆豆 - 办法总比困难多

使用mixins 可以让两个页面共用js

爱豆豆 - 办法总比困难多

mixins.js

export default {  

        data() {  
            return {  
title:'111111'  
            }  
        },  

        methods: {  

        }  
    }

a页面

<template>  
    <div class="">  
        a------{{title}}  
    </div>  
</template>  

<script>  
    import mixins from "./mixins.js"  
    export default {  
        mixins: [mixins],  
    }  
</script>  

<style >  
</style>

b页面

<template>  
    <div class="">  
        b-----{{title}}  
    </div>  
</template>  

<script>  
    import mixins from "./mixins.js"  
    export default {  
        mixins: [mixins],  
    }  
</script>  

<style >  
</style>

randy重名了 (作者)

你好，我在mixins.js 里面的 setup定义了aa，在页面上无法使用。在vue上定义了反而能用

import { ref, computed,toRaw,reactive } from "vue"  



export default {  

    setup() {  

        const aa = ref(0)         

        return {aa}  

    },  

    data() {  

        return {  

            title: 'Hello2'  

        }  

    },  

    onLoad() {  



    },  

    methods: {  



    }  

}

2023-10-26 11:14

爱豆豆

回复 randy重名了: 你这是vue3啊 vue3中没有mixin

2023-10-26 11:30
爱豆豆

直接导入就行了 import "./mixins.js"

2023-10-26 11:30
randy重名了 (作者)

回复爱豆豆: 我用vue3，改良了一下，发现defineProps只能在.vue上用，不能在.js上用。

2023-10-26 11:48

randy重名了 (作者)

回复爱豆豆: 改成这样，我最想要的是import 进去，啥都不用动最好

<script setup>  

    import { ref, computed,toRaw,reactive } from "vue"  

    import mindex from "./index2.js"    



    const props = defineProps({  

        id: String,  

    });  



    const { aa,pageData,add } = mindex(props);  



</script>

2023-10-26 11:50

爱豆豆

回复 randy重名了: 你这个是改好了还是没改好？

2023-10-26 11:57

喜欢技术的前端 - QQ---445849201

定义一个 index.js 公用

export default {  
    index:0,  
    sayHello(){  
        console.log('sayHello')  
    }  
}  
页面里面引入  
import index from '@/common/js/index';  
console.log(index.num);  
index.sayHello()

要回复问题请先登录或注册

请教两个vue界面如何共用一个js

3 个回复

公告

相关问题

请教两个vue界面如何共用一个js

与内容相关的链接

3 个回复

公告

相关问题