clipboard 剪切板

v0.8+ 我们可以通过 clipboard 模块的 getString()、setString() 接口从系统的粘贴板获取内容或者设置内容。 以前当我们收到一条短信验证码信息时,除了人肉拷贝,我们无法获取拷贝短信的内容。这是非常苦恼的。但是现在我们可以通过简单的调用 clipboard.getString() 接口来获取短信内容了。 注意 * 仅支持文本拷贝 * 出于安全考虑和平台限制,只支持 Android 和 iOS,不支持 html5。

API

getString(callback)

从系统粘贴板读取内容。

参数

  • callback {function (ret)}:执行完读取操作后的回调函数。ret {Object} 为 callback 函数的参数,有两个属性:
    • ret.data:获取到的文本内容;
    • ret.result:返回状态,可能为 success 或 fail。

setString(text)

将一段文本复制到剪切板,相当于手动复制文本。

参数

  • text {string}:要复制到剪切板的字符串。

Example

  1. <template>
    2.   <div>
    3.     <div class="div">
    4.       <text class="text" @click="onItemClick">{{message}}</text>
    5.     </div>
    6.     <div class="div">
    7.       <text class="text" @click="setContent">Click to copy: {{tobecopied}}</text>
    8.     </div>
    9.   </div>
    10. </template>
    11.   12. <script>
    13.   const clipboard = weex.requireModule('clipboard')
    14.   15.   export default {
    16.     data () {
    17.       return {
    18.         tobecopied: 'yay!',
    19.         message: 'nothing.'
    20.       }
    21.     },
    22.   23.     methods: {
    24.       setContent () {
    25.         clipboard.setString(this.tobecopied)
    26.       },
    27.       onItemClick () {
    28.         this.message = 'clicked! '
    29.         clipboard.getString(ret => {
    30.           this.message = 'text from clipboard:' + ret.data
    31.         })
    32.       }
    33.     }
    34.   }
    35. </script>
    36.   37. <style scoped>
    38.   .div {
    39.     flex-direction: row;
    40.     justify-content: space-between;
    41.     align-items: center;
    42.     width: 750px;
    43.     height: 90px;
    44.     padding-left: 30px;
    45.     padding-right: 30px;
    46.   47.     border-bottom-width: 1px;
    48.     border-style: solid;
    49.     border-color: #DDDDDD;
    50.   }
    51.   .text {
    52.     width: 750px;
    53.     height: 90px;
    54.   }
    55. </style>

try it