Category : vuejs2

app.js require(‘./bootstrap’); window.Vue = require(‘vue’); Vue.component(‘exampleComponent1’, require(‘./components/exampleComponent1.vue’)); Vue.component(‘exampleComponent2’, require(‘./components/exampleComponent2.vue’)); const app = new Vue({ el: ‘#app’ }); from the above code, I want to pass data from exampleComponent1 to exampleComponent2 when some event has occurred in exampleComponent1. What is the optimal solution for this ?? Sourc..

Read more

require(‘./bootstrap’); window.Vue = require(‘vue’); Vue.component(‘exampleComponent1’, require(‘./components/exampleComponent1.vue’)); Vue.component(‘exampleComponent2’, require(‘./components/exampleComponent2.vue’)); const app = new Vue({ el: ‘#app’ }); from the above code, I want to pass data from exampleComponent1 to exampleComponent2 when some event has occurred in exampleComponent1. What is the optimal solution for this ?? Sourc..

Read more

I seem to recall being able to emit an event from a parent component to a child component by specifying the emitted event in the opening <template> tag of the corresponding child component. However for some reason it is no longer working in my implementation. Am I delusional or was this possibly a feature from ..

Read more

I seem to recall being able to emit an event from a parent component to a child component by specifying the emitted event in the opening <template> tag of the corresponding child component. However for some reason it is no longer working in my implementation. Am I delusional or was this possibly a feature from ..

Read more

I’m using vue-social auth package for google login Link: https://www.npmjs.com/package/vue-social-auth As i press the login button i’m getting: [Vue warn]: Error in v-on handler: "Error: Request handler instance not found" Here is the way i’m using it: app.js import VueSocialauth from ‘vue-social-auth’ Vue.use(VueSocialauth, { providers: { google: { clientId: ‘XXXXXXXXXX.apps.googleusercontent.com’, redirectUri: ‘auth/google/callback’ // Your client ..

Read more

This is for my Laravel + Vue SPA app. I have this Laravel Mix config file here: const path = require(‘path’); const fs = require(‘fs-extra’); const mix = require(‘laravel-mix’); const tailwindcss = require(‘tailwindcss’); require(‘laravel-mix-bundle-analyzer’); function publishAssets() { const publicDir = path.resolve(__dirname, ‘./public’); if (mix.inProduction()) { fs.removeSync(path.join(publicDir, ‘dist’)); } fs.copySync(path.join(publicDir, ‘build’, ‘dist’), path.join(publicDir, ‘dist’)); fs.removeSync(path.join(publicDir, ‘build’)); ..

Read more

I am creating a single page application using laravel and vue. it’s not loading index component on page load. Welcome.blade.php <body> <div id="app"> <router-view></router-view> </div> <script src="{{asset(‘js/app.js’)}}"></script> </body> router.js file import Vue from ‘vue’; import VueRouter from ‘vue-router’; Vue.use(VueRouter) const routes = [ { path: ‘/’, component: require(‘./components/IndexComponent.vue’) }, { path: ‘/login’, component: require(‘./components/LoginComponent.vue’) } ..

Read more

I have laravel/VueJs app which is supporting multiple language but there is one issue, when I change language on VueJs html Lang tag will not change. Code <!doctype html> <html lang="{{ str_replace(‘_’, ‘-‘, app()->getLocale()) }}"> <head> <meta charset="utf-8"> <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no"> <meta name="csrf-token" content="{{ csrf_token() }}" /> <title>{{ config(‘app.name’, ‘Laravel’) }}</title> <link href="{{ ..

Read more

I have dynamic fields where I can add/remove inputs and get array of inputs to send to my back-end but it always sends values of my array as [Object Object] Code <div class="col-md-12"> <vs-row> <vs-table> <template #tbody> <vs-tr v-for="(row, index) in form.titles" :key="index"> <vs-th><strong>Title</strong></vs-th> <vs-td> <vs-input ref="titled" v-model="row.title"></vs-input> </vs-td> <vs-td> <vs-button icon color="danger" border type="button" ..

Read more

I am using Laravel Livewire and I need to include a vuejs component in the template. How can I bind vuejs list value in livewire? How to link/synchronize the values. Here are the fields. VueJs : <input name="cities" :value="selected"> Livewire : <input wire:model="cities" name="cities"> I have not something already done. I am looking for a ..

Read more

I have this attributes data data(){ return { formData :new Form({ attributes:[], }), I have a attribute id and an attribute value so i want to pass this id and value to url so that i cab loop in my controller attributes array and get id and value : localhost:8000..?attributes[][‘attribute_id_1’]=attributevalue1&attributes[][‘attribute_id_2′]=attributevalue2… I’m redirecting like this : ..

Read more

I’m trying to Login using Laravel and Vue.js its controller code is: public function login(Request $request){ $validation = Validator::make($request->all(),[ ‘user_id’ => ‘required|email’, ‘password’ => ‘required|string|min:8|max:15’, ]); if ($validation->fails()) { $response[‘status’] = false; $response[‘message’] = $validation->errors()->first(); return response()->json($response,200); } if(Auth::attempt([’email’ => request(’email’), ‘password’ => request(‘password’)])){ $user = Auth::user(); $token = $user->createToken(‘MyApp’)->accessToken; $user->api_token = $token; $user->save(); return ..

Read more

I’m saving image in following path : storageapppublicimguser_image and saving image url like this in database: /img/user_image/285070719.png trying to display image like this: <img :src="’../app/public’+profile.image"> but the image does not display, Any solution to resolve this issue is highly appreciated. Sourc..

Read more

Every day, I come to my office, launch my IDE (Code – OSS) and run npm run watch. Every day it works like a charm. But not today. Oddly enough, today running npm run watch fires this error: ERROR in multi vue Module not found: Error: Can’t resolve ‘vue’ in ‘/home/TopSecretUser/Code/Local/TopSecretProject/11.11.2020/dev’ @ multi vue /js/vendor[0] ..

Read more

I am using vue 2.6.12 in combination with Laravel. For my use case, I am populating a dropdown with values from a database, using a v-for loop. This is my code: <select class="pagination-select" v-model="selectedDepot"> <option v-for="(depot, index) in depots" :id="depot.DEPOTID" :value="depot.DEPOTNAME" v-text="depot.DEPOTNAME"></option> </select> I have a data property for the v-model selectedDepot: data(){ return{ selectedDepotID: ..

Read more