Data Property of Custom Components

Custom components can be used in multiple scenarios such as detail pages, custom buttons, custom homepages, etc. The data properties received by custom components vary across different scenarios (we will unify these differences in future versions while maintaining backward compatibility).
This section describes the data structures in different scenarios to help developers quickly utilize them.

Usage in Object Detail Pages

<template>  
    ...  
</template>  
<script>  
    export default {  
        props: ['data'],  
        created(){  
            console.log(this.data.object_api_name);  
            console.log(this.data.object_id);  
        }  
    }  
</script>  
<style lang="less" scoped>  
    ...  
</style>  

Custom Pages

Custom pages do not have additional data.

Detail Page UI Buttons

<template>  
    ...  
</template>  
<script>  
    export default {  
        props: ['data'],  
        created(){  
            console.log(this.data.objectAPIName);  
            console.log(this.data.objectData);  
            console.log(this.data.objectId);  
        }  
    }  
</script>  
<style lang="less" scoped>  
    ...  
</style>  

Form Page UI Buttons

<template>  
    ...  
</template>  
<script>  
    export default {  
        props: ['data'],  
        created(){  
            console.log(this.data.objectAPIName);  
            console.log(this.data.objectData);  
        }  
    }  
</script>  
<style lang="less" scoped>  
    ...  
</style>  

List Page Single Record Operation UI Buttons

<template>  
    ...  
</template>  
<script>  
    export default {  
        props: ['data'],  
        created(){  
            console.log(this.data.objectAPIName);  
            console.log(this.data.objectData);  
            console.log(this.data.objectId);  
        }  
    }  
</script>  
<style lang="less" scoped>  
    ...  
</style>  

List Page Batch Operation UI Buttons

<template>  
    ...  
</template>  
<script>  
    export default {  
        props: ['data'],  
        created(){  
            console.log(this.data.objectAPIName);  
            console.log(this.data.objextIds);  
        }  
    }  
</script>  
<style lang="less" scoped>  
    ...  
</style>