插件的使用方式与 其他 NativeScript 应用 一样，但是你可能会好奇 UI 插件如何在 Vue 中工作。

UI 插件的工作原理与你在 Angular 应用中使用 NativeScript UI 插件几乎相同。

示例使用：nativescript-gradient

让我们回顾一下如何使用 nativescript-gradient。你也可以在 listview 示例 中查看其使用方式。

使用 NativeScript CLI 安装插件

在完成 NativeScript 开发环境的设置 后，运行以下命令

$ npm install --save nativescript-gradient

注意：如果你的插件无法正常工作，你可能需要清理项目，删除 Platforms 文件夹。

$ rm -rf platforms

在你的应用中注册插件

打开你的应用入口文件（可能是 app.js、main.js 或 main.ts），并在顶部添加以下行

Vue.registerElement('Gradient', () => require('nativescript-gradient').Gradient)

这将要求并在你的 Vue 实例中注册插件。registerElement 函数的第一个参数是 <Element> 的名称，第二个参数是一个返回插件的函数。提供与你在代码中调用时完全相同的元素名称。提供与 npm 包名称完全相同的插件名称。

在你的应用中使用插件

<Gradient direction="to right" colors="#FF0077, red, #FF00FF">
  <Label text="Best gradient." horizontalAlignment="center"
         style="color: white; padding: 20" />
</Gradient>