Plugins work as in any other NativeScript app, but you may wonder how UI plugins work with Vue.
UI plugins work almost identically to how you'd use a NativeScript UI plugin in an Angular app.
After you have set up your system for NativeScript development, run the following command:
npm install --save nativescript-gradient
NOTE: If your plugin doesn't work right away, you might need to clean the project by removing the Platforms folders:
rm -rf platforms
Open your app entry file (likely
main.ts) and add the following line at the top:
Vue.registerElement('Gradient', () => require('nativescript-gradient').Gradient)
This requires and registers the plugin in your
Vue instance. The
registerElement function expects the name of the
<Element> as the first argument, and a function that returns the plugin as its second argument. Provide the element name exactly as you are supposed to call it in your code. Provide the plugin name exactly as its npm package name.
<Gradient direction="to right" colors="#FF0077, red, #FF00FF"> <Label text="Best gradient." horizontalAlignment="center" style="color: white; padding: 20" /> </Gradient>