ekrist1

//helpers/link.vue

<template>
<nuxt-link :to="href" v-if="isInternalLink"> <slot /></nuxt-link>
<a :href="href" v-else> <slot /></a>
</template>

<script setup>

const props = defineProps({

ekrist1

<?php

namespace App\Jobs;

use Illuminate\Bus\Queueable;
use Illuminate\Queue\SerializesModels;
use Illuminate\Queue\InteractsWithQueue;
use Illuminate\Contracts\Queue\ShouldQueue;
use Illuminate\Foundation\Bus\Dispatchable;
use App\Item;

ekrist1

<template>
    <div>
        {{ text | truncate(isTruncated) }} <button class="text-blue" @click="isTruncated = !isTruncated">{{ isTruncated ? showMoreText : shotLessText }}</button>
    </div>
</template>

<script>
    export default {
        props: ['body'],
        data () {

ekrist1

<?php


/*************************************************************************
 * Get File Information
 */

// Assuming these come from some data source in your app
$s3FileKey = 's3/key/path/to/file.ext';
$fileName = 'file.ext';

ekrist1

 <previewvacancy
            name="Stillingsannonse"
            description="Annonse aktiveres rett etter kjøp"
            stripekey="{{ config('services.stripe.key') }}"
            email="{{ $vacancy->user->email }}">
  </previewvacancy>
  
  
  
@section('stripe')

ekrist1

<template>
    <div>
        <div class="items-center flex">
             <img itemprop="img" class="w-32 h-32 rounded-full mr-4 mr-auto ml-auto" :src="images[currentNumber]" alt="Produktbilder" />
        </div>
        <div class="mt-4 text-center">
            <a href="#" @click="prev" class="text-grey">Forrige bilde</a>  <a href="#" @click="next" class="ml-3 text-grey">Neste bilde</a>
        </div>
    </div>
</template>

ekrist1

@if ($paginator->hasPages())
    <ul class="flex list-reset w-auto justify-center">
        {{-- Previous Page Link --}}
        @if ($paginator->onFirstPage())
            <li class="block hover:text-white hover:bg-blue text-grey border-r border-grey-light px-3 py-2 cursor-not-allowed"><span>&laquo;</span></li>
        @else
            <li><a href="{{ $paginator->previousPageUrl() }}" rel="prev" class="block hover:text-white hover:bg-blue text-blue border-r border-grey-light px-3 py-2">&laquo;</a></li>
        @endif

        {{-- Pagination Elements --}}

ekrist1

<template>
    <div>
        <input id="trixJsEditor" type="hidden" name="content" value="init value">
          <trix-vue content="test"></trix-vue>
        </div>
    </div>
</template>

<script>
import TrixVue from './Trix.vue';

ekrist1

<template>
    <div>
        <div class="tabs">
            <ul>
                <li v-for="tab in tabs" :key="tab.id" :class="{ 'is-active': isActivated(tab) }"><a @click="selectTab(tab)">{{ tab.name }}</a></li>
            </ul>
        </div>
    </div>

</template>

ekrist1

Add eventHub to your app.js file:
Vue.prototype.$eventHub = new Vue();


In your controller:

Generate a new resource-class (pagination metadata is included in the response)
https://laravel.com/docs/5.5/eloquent-resources

How to use the child-component in your vue-file: