We use essential cookies for the website to function, as well as analytics cookies for analyzing and creating statistics of the website performance. To agree to the use of analytics cookies, click "Accept All". You can manage your preferences at any time by clicking "Cookie Settings" on the footer. More Information.

Cookie Settings
Only Essential Cookies
Accept All
MaterialsConsole

Quick App

输入关键字搜索
HMS Core
AppGallery Connect
HUAWEI HiAI
CTRL+K
quickApp ReferencesQuick AppAPISystem CapabilitiesClipboard

Clipboard

Last updated: 2023-07-14 09:12
Content overview
Expand

API Declaration

Add the following configuration to the features attribute in the manifest.json file:

Collapse
Word wrap
Dark theme
Copy code
  1. {"name": "system.clipboard"}

Module Import

Add the following configuration to the script element on the page where the API will be called:

Collapse
Word wrap
Dark theme
Copy code
  1. import clipboard from '@system.clipboard'

Or

Collapse
Word wrap
Dark theme
Copy code
  1. var clipboard = require("@system.clipboard")

Application Scope

Expand

Item

Description

Applicable devices

Mobile phones, tablets, Vision products, and telematics devices

Applicable regions

Global

Definition

Expand

API

Description

clipboard.set(OBJECT)

Modifies content on the clipboard.

clipboard.get(OBJECT)

Reads content from the clipboard.

clipboard.set(OBJECT)

Description

Modifies content on the clipboard.

OBJECT parameters

Expand

Parameter

Type

Mandatory

Description

text

string

Yes

Content that needs to be placed on the clipboard. If an empty character string ('') is passed, the clipboard will be cleared.

success

function

No

Callback upon success.

fail

function

No

Callback upon failure.

complete

function

No

Callback upon completion.

Sample code

Collapse
Word wrap
Dark theme
Copy code
  1. clipboard.set({
  2.   text: 'text'
  3. })

clipboard.get(OBJECT)

Description

Reads content from the clipboard.

OBJECT parameters

Expand

Parameter

Type

Mandatory

Description

success

function

No

Callback upon success.

fail

function

No

Callback upon failure.

complete

function

No

Callback upon completion.

Parameters returned by success

Expand

Parameter

Type

Description

text

string

Content on the clipboard.

Sample code

Collapse
Word wrap
Dark theme
Copy code
  1. clipboard.get({
  2.   success:function(data){
  3.     console.log("handling success: " + data.text);
  4.   },
  5.   fail: function(data, code) {
  6.     console.log("handling fail, code=" + code);
  7.   }
  8. })

Demo

Collapse
Word wrap
Dark theme
Copy code
  1. <template>
  2.   <div class="container">
  4.     <div class="item-container">
  5.       <div class="item-content">
  6.         <text class="txt" if="{{show}}">{{clipboard}}</text>
  7.       </div>
  9.       <div class="item-content txt-left">
  10.         <text class="txt">setClipboardtxt: {{showSet}}</text>
  11.         <text class="txt">getClipboardtxt: {{showGet}}</text>
  12.       </div>
  13.       <input type="button" class="btn" onclick="set" value="Set Clipboard" />
  14.       <input type="button" class="btn" onclick="get" value="Get Clipboard" />
  15.     </div>
  16.   </div>
  17. </template>
  19. <style>
  20. .container{
  21.   flex: 1;
  22.   flex-direction: column;
  23. }
  24.   .item-container {
  25.     margin-bottom: 50px;
  26.     margin-right: 60px;
  27.     margin-left: 60px;
  28.     flex-direction: column;
  29.   }
  31.   .item-content {
  32.     flex-direction: column;
  33.     padding: 30px;
  34.     margin-bottom: 50px;
  35.     align-items: center;
  36.     justify-content: center;
  37.   }
  39.   .txt {
  40.     padding-top: 15px;
  41.     padding-bottom: 15px;
  42.   }
  44.   .txt-left {
  45.     align-items: flex-start;
  46.   }
  47.   .btn {
  48.   height: 80px;
  49.   text-align: center;
  50.   border-radius: 5px;
  51.   margin-right: 60px;
  52.   margin-left: 60px;
  53.   margin-bottom: 50px;
  54.   color: #ffffff;
  55.   font-size: 30px;
  56.   background-color: #0faeff;
  57. }
  58. </style>
  60. <script>
  61.   import clipboard from '@system.clipboard'
  63.   export default {
  64.     data: {
  67.       show: true,
  68.       clipboard: 'quick app',
  69.       showSet: '',
  70.       showGet: ''
  71.     },
  72.     onInit() {
  73.       this.$page.setTitleBar({ text: 'clipboard' })
  74.     },
  75.     set: function () {
  76.       this.showSet = this.clipboard
  77.       clipboard.set({
  78.         text: this.clipboard,
  79.         success: function () {
  80.           console.info('set success--- ')
  81.         },
  82.         fail: function () {
  83.           console.info('set fail--- ')
  84.         },
  85.         complete: function () {
  86.           console.info('set complete  ')
  87.         }
  88.       })
  89.     },
  90.     get: function () {
  91.       var that = this
  92.       clipboard.get({
  93.         success: function (obj) {
  94.           that.showGet = obj.text
  95.         },
  96.         fail: function () {
  97.           console.info('get fail--- ')
  98.         },
  99.         complete: function () {
  100.           console.info('get complete  ')
  101.         }
  102.       })
  103.     }
  104.   }
  105. </script>

The following figure shows the final effect.

Sensor
Location
English
©2026 HUAWEI Developers. All rights reserved.
Terms of Use
Statement About HUAWEI Developers and Privacy
Cookies
Cookie Settings
Open-Source Software Notice