morgul / vueboot Goto Github PK

import { tabset, tab  } from 'vueboot'


WARNING in ./~/vueboot/dist/vueboot.js
Critical dependencies:
2:480-487 This seems to be a pre-built javascript file.

Is there a way to get round this? Thanks.

Hi, i tryeds vueboot since i cant get vue-strap to work with webpack/vue-loader.
vueboot seems to work fine with them, but something is odd with the tab-headers:
i have:

    var vueboot = require('vueboot');
    window.addEventListener('load', function () {
        var app = new Vue({
            components: {
                'tab': vueboot.tab,
                'tabset': vueboot.tabset
            },
            data:{
                tabs:[
                    {"tab_name":"test1"},
                    {tab_name:"test2"}
                ]
            }

and the template:

   <tabset>
            <tab v-for="tab in tabs" header="{{tab.tab_name}}">
    <tabset>

no i literally get the tabname {{tab.tab_name}}

do i something wrong here?

hey, i am trying myself to get startet with vue.js & javascript

i used vue-cli to get up and running with the webpack sample project.

i added a view Bar that looks like this:

<template>
  <nav-component></nav-component>
  <div class="hello-bar">
    <h1>{{ msg }}</h1>
    <h4>Static</h4>
    <alert type="info" :dismissible="false">
      This is an <strong>info</strong> alert.
    </alert>
    <h4>Timeout</h4>
    <button class="btn btn-primary" @click="showAlert()">ShowAlert</button>
    <alert v-if="show" type="danger" :timeout="4000" :on-closed="onClosed">
      This message should time out after 4 seconds.
    </alert>
  </div>
</template>

<script>
  import { alert } from 'vueboot'

  export default {
    components: {
      alert: alert
    },
    data () {
      return {
        msg: 'Hello Bar World!',
        show: false
      }
    },
    methods: {
      onClosed: function () {
        console.log('onClosed!')
        this.show = false
      },
      showAlert: function () {
        this.show = true
      }
    }
  }
</script>

but for some reason the two alerts i have wont work as expected.

i just get the error "ReferenceError: $ is not defined while trying to use alert" in the console.

triggering the second alert will successfully show the alert, but it wont hide after 4 seconds.

Kind Regards,

Stephan

Good day,

Sorry to bother but I am trying out your project, which is great by the way, within a Laravel 5.3 project but I am having an issue with the tabs component.

I have added three tabs

<tabset v-if="contentVisible" transition="slideOut">
	<tab>
		<header>
			Details
		</header>
		
		<p>'Details' tab content section</p>
	</tab>
	<tab v-if="data.downloads.length !== 0">
		<header>
			Downloads
		</header>
		
		<p>'Downloads' tab content section</p>
	</tab>
	<tab v-if="data.images.length !== 0" :on-selected='gallerySelected'>
		<header>
			Gallery
		</header>
		
		<p>'Gallery' tab content section</p>
	</tab>
</tabset>

However, when displayed within a browser the 'Details' tab is displayed as the third tab instead of as the first tab.

Any assistance would be truly greatful.

As a side note, using bootstrap directly the tab ordering works as expected.

Because of a document reference, built-in linting with Nuxt.js fails

I need form etc.

Hi! maybe im doing something wrong, but i tried using the alerts with timeout and they are never being dismissed.

<alert type="danger" :timeout="4000"> This message should time out after 4 seconds. </alert>

I get no errors, but the alert is simply not dissappearing

thanks!

Everything is going to the left when modal is open.
Visible on your demo page.