solid-vue-components.logged-out

Pane that only shows its contents when the user is logged in.

Usage no npm install needed!

<script type="module">
  import solidVueComponentsLoggedOut from 'https://cdn.skypack.dev/solid-vue-components.logged-out';
</script>

README

solid-vue-components.logged-out

Pane that only shows its contents when the user is logged in.

Installation

Directly in the browser

Drop the component in with a <script> tag alongside Vue:

<div id="app">
<!-- ... use component here ... -->
</div>

<script src="https://unpkg.com/vue"></script>
<script src="https://unpkg.com/solid-vue-components.logged-out"></script>
<script>
new Vue({ el: '#app' })
</script>

In a module system

Install the component with NPM:

npm install solid-vue-components.logged-out

Then import the component:

import LoggedOut from 'solid-vue-components.logged-out'

And either globally register it for use in all components:

Vue.component(LoggedOut, 'solid-vue-components.logged-out')

or locally register it for use in an individual component:

export default {
components: { LoggedOut }
}

Usage

<LoggedIn>
  <p>This is only visible for logged in users.</p>
</LoggedIn>