node webkit: open thousands of urls in browser

Admin 1
Viewed 42

I am using following snippet to open a link in default browser.

<template>
  <div>
     <a @click.prevent="fireUpLink">External Link</a>
  </div>
</template>

.

<script>
    /* global nw */
    export default {
      methods: {
        fireUpLink: function() {
          nw.Shell.openExternal("http://example.com/");
        }
      }
    };
    </script>

But lets say if I have thousands of links, this solution is not scalable. Is there any better way?

node-webkit
2 Answers

In a Vue SFC, it expects a referenced variable to be defined or imported in the component, or be global. If you reference it from the global window object, it should work.

window.nw.Shell.openExternal('http://example.com');
user_155034790

For Vue, as shown by Max, <a @click.prevent="window.nw.Shell.openExternal('http://example.com')">Link</a> works.

You could also just create a component:

<template>
  <a
    :href="url"
    class="link"
    @click.prevent="openExternal"
  ><slot></slot></a>
</template>
<script>
export default {
  name: 'ExternalLink',
  props: {
    url: {
      type: String,
      required: true
    }
  },
  methods: {
    openExternal: function () {
      window.nw.Shell.openExternal(this.url);
    }
  }
};
</script>

Then just reference it like this:

<external-link url="http://example.com">Link</external-link>

Alternatively you could create a mixin that has the openExternal method in it, and globally install it across all components, so you can just do <a @click.prevent="openExternal('http://example.com')>

If you are using something other than Vue, which does not use a Virtual DOM, then you could just add a class="external-link" then target all elements on the page with that class and handle them.

$('.external-link').click(function (evt) {
  // Prevent the link from loading in NW.js
  evt.preventDefault();
  // Get the `href` URL for the current link
  let url = $(this).attr('href');
  // Launch the user's default browser and load the URL for the link they clicked
  window.nw.Shell.openExternal(url);
});
user_10582620
Related