vue-component

问题 I have several nested components on the page with parents component having @click.native implementation. Therefore when I click on the area occupied by a child component (living inside parent), both click actions executed (parent and all nested children) for example <products> <product-details> <slide-show> <media-manager> <modal-dialog> <product-details> <slide-show> <media-manager> <modal-dialog> </products> So I have a list of multiple products, and when I click on "canvas" belonging to

问题 I have a parser method inside my component, when that method is working I want to create components (or even just elements) from values that is computed. Is it possible to creating component or html elements when method is working? 回答1: Is it possible to creating component or html elements when method is working? Its not possible in JavaScript using synchronous code . JavaScript is single-threaded and even browser rendering is blocked when your synchronous/long running code is executing, not

问题 My view like this : @foreach($leagues as $league) <a @click="$refs.leagues.changeLeague({{ $league->id }})"> {{ $league->name }} </a> @endforeach ... <top-league class="slick" league-id="{{ $league_id }}" ref="leagues"></top-league> My top league component vue like this : <template> <div class="row"> <div class="col-md-3" v-for="item in items"> <div class="panel panel-default"> <div class="panel-image"> <a :href="baseUrl+'/leagues/'+item.id+'/'+item.name" :style="{backgroundImage: 'url(' +

问题 My vue component is like this : <template> <a class="btn btn-block" :class="[response == 'responseFound' ? ' btn-yellow' : ' btn-default']"> ... </a> </template> It works But, I want to combine it to be one class I try like this : <template> <a :class="'btn' [response == 'responseFound' ? ' btn-yellow' : ' btn-default'] ' btn-block'"> ... </a> </template> But it does not work How can I solve it? 回答1: Everything inside :class or v-bind:class is an expression. So: <template> <a :class="'btn' +

问题 I have an app with panels you can drag around that are all generated from a basic array of names like so: <template> <div id="wrapper"> <nametag v-for="(name, i) in guests" :key="i" :name="name" /> </div> </template> <script> import Nametag from "@/components/Nametag.vue"; module.exports = { name: 'seating', components: { Nametag }, data () { return { guests: ['Vanessa', 'Lillie', 'Olivia'] } } }; </script> Nametag is a component with all the code for dragging it around on the screen. The x

问题 I have a component ResultPill with a tooltip (implemented via vuikit) for the main container. The tooltip text is calculated by a getter function tooltip (I use vue-property-decorator) so the relevant bits are: <template> <div class="pill" v-vk-tooltip="{ title: tooltip, duration: 0, cls: 'some-custom-class uk-active' }" ref="container" > ..some content goes here.. </div> </template> <script lang="ts"> @Component({ props: ... }) export default class ResultPill extends Vue { ... get tooltip ()

问题 I have vue version 2.9.3 I am trying to get names from a REST API URL: http://192.168.1.3/api/clinic/patients?q=s will return name of patients starting with S . it by default takes q as parameter see docs And following the docs I implemented it like shown below: <template> <div> <div class="alignLabel"> <label for="patientName"> <span>Patient Name <span class="required">*</span></span> </label> </div> <div> <autocomplete url="http://192.168.1.3/api/clinic/patients" anchor="title" label=

问题 I'm creating a component in VueJS for an app I'm making, it has some watchers to apply logic to other parts of the component when my var changes. Once the component is initialized, it still needs to be set by some data from the server coming after a few events done by the user via Axios. This data gets to the component from an event emmited by the main app. Now the thing is that this var usually changes (not always), but I don't want that logic to be applied this first time, so I decided to

问题 I'm creating a component in VueJS for an app I'm making, it has some watchers to apply logic to other parts of the component when my var changes. Once the component is initialized, it still needs to be set by some data from the server coming after a few events done by the user via Axios. This data gets to the component from an event emmited by the main app. Now the thing is that this var usually changes (not always), but I don't want that logic to be applied this first time, so I decided to

问题 I am getting the error from the title: Uncaught TypeError: cloned[i].apply is not a function at HTMLInputElement.invoker (vue.esm.js?65d7:1810) Made standard setup with vue-cli (simple webpack) , and this is my component: <template> <div class="column is-4"> <nav class="panel"> <p class="panel-heading"> Authors in our library </p> <div class="panel-block"> <p class="control has-icons-left"> <input class="input is-small" type="text" placeholder="Search" v-model="search" @keyup="filterAuthors">