vue-component

How can I upload image use ajax on the vue.js 2?

此生再无相见时 提交于 2020-01-14 03:35:08
问题 My component vue is like this : <template> <div class="modal" tabindex="-1" role="dialog"> <div class="modal-dialog" role="document"> <div class="modal-content"> <form method="post" :action="baseUrl+'/product/editImage'" enctype="multipart/form-data"> ... <input type="file" v-on:change="changeImage" name="image" id="image" required> ... </form> </div> </div> </div> </template> <script> export default{ ... methods: { changeImage(e) { data = new FormData(); data.append('file', $('#image')[0]

TinyMCE and Vuejs as a component

微笑、不失礼 提交于 2020-01-13 18:08:25
问题 I am trying to make a Vue Component for TinyMCE but I am facing some problems that I can not solve! Can anybody help me? Or maybe advise a better way to walk ? There is my Component import Vue from 'vue' import _ from 'lodash' export default { props: { model: { default () { return null } }, showLeadInfo: { default () { return false } } }, data() { return { id: 'editor_' + _.random(10000, 99999) } }, watch: { model() { if (this.model == null) tinyMCE.activeEditor.setContent(''); } }, ready() {

TinyMCE and Vuejs as a component

南楼画角 提交于 2020-01-13 18:07:05
问题 I am trying to make a Vue Component for TinyMCE but I am facing some problems that I can not solve! Can anybody help me? Or maybe advise a better way to walk ? There is my Component import Vue from 'vue' import _ from 'lodash' export default { props: { model: { default () { return null } }, showLeadInfo: { default () { return false } } }, data() { return { id: 'editor_' + _.random(10000, 99999) } }, watch: { model() { if (this.model == null) tinyMCE.activeEditor.setContent(''); } }, ready() {

How to setup a centralized state for a mapbox map in Vuex?

青春壹個敷衍的年華 提交于 2020-01-13 09:36:06
问题 I just started using vuex with vue. I do (roughly) understand the docs. I have a specific issue for which I am not sure whether I should use vuex and if so how to go about. I have an app in which mapbox map(s) are omnipresent in various layouts and components etc. As I will be making several vue single file components but are working with one same instance of a mapbox map I think it makes sense to have the mapbox map initiated and managed in the vuex store. So e.g. when I change the map

Vue Js: Issue with scoped slots and IE11

梦想的初衷 提交于 2020-01-13 03:16:27
问题 My component looks like this: <template> <div> <div v-if="!loaded"> <p><i class="fas fa-spinner fa-spin"></i> Loading feed</p> </div> <div v-else> <div data-slider ref="feedSlider" v-if="length > 0"> <div class="swiper-wrapper"> <div class="slide" v-for="record in records" :key="record.id"> <slot :record="record"></slot> </div> </div> </div> <div v-else> <p>There are no records available.</p> </div> </div> </div> </template> <script> import Swiper from 'swiper'; import AjaxCaller from '../..

How can I add notification automatic after add to cart in the vue component?

十年热恋 提交于 2020-01-11 13:09:15
问题 My vue component to add to cart like this : <template> <div class="wrapper"> ... <b-btn variant="warning" class="btn-square mt-2 col-md-12" @click="addToCart(item)"><i class="fa fa-cart-arrow-down"></i> Add to cart</b-btn> ... </div> </template> <script> export default { ... methods: { addToCart(item) { let data = [{ number: item.number, price: item.price, description: item.description, quantity: this.quantity, }] if (this.$session.get(SessionKeys.Cart) === undefined || this.$session.get

How can I add notification automatic after add to cart in the vue component?

孤街醉人 提交于 2020-01-11 13:09:12
问题 My vue component to add to cart like this : <template> <div class="wrapper"> ... <b-btn variant="warning" class="btn-square mt-2 col-md-12" @click="addToCart(item)"><i class="fa fa-cart-arrow-down"></i> Add to cart</b-btn> ... </div> </template> <script> export default { ... methods: { addToCart(item) { let data = [{ number: item.number, price: item.price, description: item.description, quantity: this.quantity, }] if (this.$session.get(SessionKeys.Cart) === undefined || this.$session.get

Vue.js print raw html and call component methods

大兔子大兔子 提交于 2020-01-11 12:14:50
问题 I am dynamically loading the html content from an ajax request. This html has some buttons like <button @click="someComponentMethod">Add</button> As you can see I am trying to call components methods. But Its not working. I think instead of @click html's default attribute "onclick" should work. But this will only recognize the function that are defined in global scope. Can someone guide me how I can call component's function from core javascript i.e using "onclick". Update Ok! I got it that v

How can I implement server side rendering (ssr) on the vuetify project that is 100% complete?

≡放荡痞女 提交于 2020-01-09 08:16:07
问题 I had install my project vuetify with this reference : https://vuetifyjs.com/en/ My project has been 100% complete. Now I want to implement SSR for Search Engine Optimization (SEO) I search on google and I find there exist 3 option to implement SSR to vuetify project https://ssr.vuejs.org/ https://github.com/vuetifyjs/webpack-ssr https://nuxtjs.org/ If I using option 2 or option 3, it seems I must to change my template. Maybe I should rewrite my code on the template. Because my template using

Webpack issue when compiling JS files

≯℡__Kan透↙ 提交于 2020-01-07 03:11:35
问题 I am working on a Laravel 5.3 project, I have been using webpack with no issues until I tried to add some configurations for ES6. These included addind babel packages to my npm module. It broke my code so I reverted back all the changes but now whenever I change a JS file and compile, this line is added to the final JS file and it causes the Vue instance to be undefined (The line appears whenever I run gulp whether I change a file or not). I am using this package laravel-elixir-vue-2 and from