如何在Vuejs中调用2个变量？
在Vue.js中调用两个变量可以通过以下步骤实现：
- 在Vue实例的data选项中定义两个变量，例如：
data() {
return {
variable1: 'value1',
variable2: 'value2'
}
}- 在Vue模板中使用插值表达式或指令来调用这两个变量，例如：
<div>{{ variable1 }}</div>
<span v-text="variable2"></span>- 如果需要在Vue的计算属性或方法中使用这两个变量，可以直接引用它们，例如：
computed: {
computedProperty() {
return this.variable1 + ' ' + this.variable2;
}
},
methods: {
methodExample() {
console.log(this.variable1, this.variable2);
}
}这样就可以在Vue.js中调用两个变量了。请注意，这只是一个简单的示例，实际应用中可能涉及更复杂的逻辑和用法。对于Vue.js的更多详细信息和用法，请参考腾讯云的Vue.js文档：Vue.js文档
相关·内容
2回答
我有一张有不同宽度的柱子的桌子。我使用粘性标题来计算列的宽度。
现在，我编写了一个函数，通过双击标题来增加列的宽度。这适用于第一次双击。但是如果我点击它4或6次，在第一次双击之后什么也不会发生。如何重新设置事件，以便在再次单击2次之后再次触发该事件？
当我移动鼠标时，我可以一个接一个地做几次双击。但这不是目标。
下面是代码片段：
<th
v-for="c in data.columns"
v-if="visiblecolumns.includes(c)"
v-on:dblclick="COLUMN_DEFINITION[c]+=5
浏览 2提问于2018-08-30得票数 2
回答已采纳
1回答
我是VueJS的新手。
让我们假设我计划创建一个广泛的应用程序。例如，我有三个单独的页面: mypage.com/account、mypage.com/players、mypage.com/orders。每个页面都有自己的控制器，在其中我返回一个带有视图的文件(account.blade.php等)。并在变量中传递参数。那么，在每一个我都想使用Vue。这里我有几个问题：
1)是否需要为/ resources / js /文件夹中的每个页面创建单独的app.js文件？类似于：
app-account.js
const app-account = new Vue({
el: '#a
浏览 0提问于2020-05-14得票数 0
回答已采纳
我试图在模式中显示client信息的细节。单击@click="showDetails(props.row.id)"之后。
我正在方法中使用axios.get并返回数据。现在，它以PromiseValue对象的形式返回数据。如何访问PromiseValue以在HTML中显示值。有人能帮我解决这个问题吗？我试着像下面这样-
<button @click="showDetails(props.row.id)"><i class="fas fa-eye"></i></button>
在脚本中-
<sc
浏览 0提问于2019-05-23得票数 5
回答已采纳
1回答
在数据函数中，我用今天的日期创建了明日变量，然后用附录1对它进行了设置，但是我得到了这个错误
data(){
return{
tomorrow: new Date(),
tomorrow.setDate(tomorrow.getDate() + 1),
};
},
错误解析错误:意外令牌.
浏览 1提问于2021-12-08得票数 0
回答已采纳
我在两个不同的组件中使用mounted中的window.onresize。当窗口改变大小时，它将在window.onresize中运行代码，但它只运行一个组件，而不是同时运行两个组件。
如何让它在两个组件中同时运行两个window.onresize？
mounted() {
window.onresize = () => {
this.productDetailRatio = window.innerWidth / 1900;
this.screenWidth = window.innerWidth;
this.productDetailRatiofont =
浏览 0提问于2020-05-11得票数 0
请检查我的密码。
<template>
<div class="row flex">
<div class="col-md-6 home_feed">
<post-detail :posts="posts"></post-detail>
</div>
</div>
</template>
<script>
import axios from 'axios'
export defau
浏览 3提问于2017-11-09得票数 2
我在页面上有简单的<script>连接和jquery。下面是示例：https://codepen.io/TidioSupport/pen/WNePeao 如何正确地将其添加到我的Vue组件中？因为当我尝试添加它时，我收到了：Templates should only be responsible for mapping the state to the UI. Avoid placing tags with side-effects in your templates, such as <script>, as they will not be parsed. or
浏览 24提问于2021-04-20得票数 0
我在VueJS相对较新。我在vueJS中使用vueJS插件有困难。
我已经在我的main.js import 'tail.select'上导入了这个插件
但是，在我的mounted上调用mounted时，它给了我一个错误，上面写着Uncaught ReferenceError: tail is not defined。
HTML
<select class="form-control form-control-sm select">
<option>1</option>
<option>2</opti
浏览 0提问于2019-08-13得票数 0
1回答
在将innerText从generatePseudonym()函数呈现为模态对话框时，我遇到了问题，下面是我的意思
我想要将输出Anastasia Shah打印到Hello字符串中，当我单击generate化名按钮时，我已经尝试了胡子语法{{ logPseudonym() }}，但它不起作用，下面是我的代码
<v-dialog transition="dialog-top-transition" max-width="600">
<template v-slot:activator="{ on, attrs }"
浏览 5提问于2022-01-04得票数 1
回答已采纳
1回答
在下面的我的应用组件中，mounted()生命周期钩子没有被触发：
<template>
<div>
<div v-if='signedIn'>
<router-view />
</div>
</div>
</template>
<script>
import Vue from 'vue'
import Oidc from 'oidc-client'
Vue.use(Oidc)
export default
浏览 1提问于2017-11-15得票数 10
回答已采纳
1回答
我下载pdf文件，但它是空的。当我打开它的时候，我会得到这个
未能加载PDF文档。
这是我的本意：
[HttpGet("{id}/contract-agreement")]
[Produces("text/html", "application/pdf", Type = typeof(FileContentResult))]
[ProducesResponseType(StatusCodes.Status400BadRequest, Type = typeof(ValidationErrorResponse))]
[ProducesRespon
浏览 6提问于2021-09-28得票数 0
我目前正在开发一个具有SASS集成的VueJS项目，我希望能够访问组件脚本部分中的SASS变量，以便进行动态样式计算。我在纯JS中看到了这方面的例子，并试图将其转换为VueJS组件。
到目前为止，我已经能够在Vue文件的样式部分集成SASS变量，但是我无法将导入到组件脚本中的变量。
我尝试了以下几点：
导出我的scss文件中的变量：
:export {
primaryColor: $primary;
}
然后在我的组件中导入文件：
import variables from '@/assets/scss/main.scss'
并按如下方式访问它：variables.pr
浏览 2提问于2021-04-03得票数 2
我已经阅读了关于通过admin SDK列出所有用户的文档，但仍然很难在我的vue组件中显示用户... 文档中的代码是： function listAllUsers(nextPageToken) {
// List batch of users, 1000 at a time.
admin.auth().listUsers(1000, nextPageToken)
.then(function(listUsersResult) {
listUsersResult.users.forEach(function(userRecord) {
conso
浏览 33提问于2019-09-05得票数 0
回答已采纳
我有： <input type="radio" :name="activity"
v-model="activity"
:value="1"
v-on:change="callProc(data, data2)"
required> . 当已经从数据库中填充了值时，即显示div，即使它不是
浏览 17提问于2019-06-06得票数 0
2回答
我真的是VueJS的新手，我混合使用了RxJS，Vue rx和Vue Resource，这样我就可以进行http调用，并在任何地方获得可观察到的内容……太棒了！现在我试过了
subscriptions () {
return {
titles$: this.getHTTPObservable('https://jsonplaceholder.typicode.com/albums').flatMap(arr => Rx.Observable.from(arr).take(10).map(o => o.title).toArray())
}
我现在唯
浏览 7提问于2017-07-17得票数 1
查看Vue文档，我无法理解如何使用模板中已有的数据在Vue中调用带参数的函数。 例如, JavaScript var vm = new Vue({
el: '#example',
data: {
message: 'Hello'
},
methods: {
reverse: function (word) {
return word.split('').reverse().join('');
}
}
}) HTML &
浏览 47提问于2019-02-11得票数 1
回答已采纳
我是VueJS的新手，我想在我的Symfony平台上使用它。我想知道如何在小枝变量中添加一个VueJs变量。
以下是我的例子：
<div v-for="competition in Vcompetitions">
<div class="thumbnail">
<a v-bind:href="XXX">
<img v-bind:src="competition.src">
</a>
</div>
浏览 5提问于2017-07-20得票数 3
回答已采纳
2回答
我正在使用vue-google地图，并试图在我的地图上绘制多边形。在这一点上，我很好，但我想得到我的点击地图上的lat和lng位置。当我这么做的时候
<GmapPolygon v-for="cabstand in cabstands" :path="cabstand.positions" @click="getCabstandClick"/>
用我的方法
getCabstandClick(data) {
console.log(data);
}
我可以得到一个具有lat & lng位置的对象，但是我必须触发两个方法，所
浏览 2提问于2020-03-08得票数 0
我正在使用Laravel和VueJS创建一个简单的登录表单。
因为我是在.vue文件中设计登录表单的模板，所以@csrf根本不起作用。
那么，如何在.vue文件中的任何形式中添加csrf-token (@csrf)或任何刀片语法？
Login.vue
<template>
<div class="app">
<form action="/login" method="post">
@csrf <!-- How can I make this work --
浏览 1提问于2018-04-05得票数 0
在正常的上下文中，我们只是将翻译变量附加到变量，比如：this.name = this.$t('language.name');，但我想在某个时候用一种特定的语言来指定它(例如:法语)。我们可以在Vuejs中做这样的事情吗？
this.name = this.$t('language.name', locale: fr);
浏览 13提问于2021-07-19得票数 1
3回答
我需要把一个变量传递给一个组件。我的设置如下：
主营：Meet.vue
<html>
<div class="carousel-cell">
<Category :searchTerm="woman"></Category>
</div>
<div class="carousel-cell">
<Category :searchTerm="men"></Category>
</div>
[
浏览 0提问于2019-04-26得票数 1
回答已采纳
2回答
我需要通过点击清理画布。它是SPA，运行Vue CLI v.3.5.0。
当我单击按钮时，$forceUpdate不会触发，但会发生另一个操作(例如，console.log)。
<div class="drawing__container">
<canvas class="drawing-canvas"
id="canvas"
:width=canvas_width
:height=canvas_height
浏览 0提问于2019-04-11得票数 0
回答已采纳
我正在使用quasar抽屉，我想在注册视图中隐藏抽屉，用我当前的代码它确实隐藏了，但问题是当我重新加载注册页面时，它仍然在几毫秒内呈现在DOM中，然后抽屉消失。
我不知道如何在根本看不到DOM中呈现的情况下修复它，或者可能控制了抽屉，在默认情况下将其设置为false，然后在其他路径上显式地手动呈现它。
<template>
<div>
<q-header elevated class="bg-indigo-4">
<q-toolbar>
<q-toolbar-title class=&
浏览 0提问于2020-05-24得票数 1
如何在这个vuejs演示中传递参数？
错误：
Uncaught SyntaxError: Unexpected token .
此错误出现在这行js代码中：
setSelectedItem(item.message)
我该怎么办？
浏览 2提问于2016-08-23得票数 0
回答已采纳
我正在尝试使用vuejs和gsap在h2之间实现一个非常基本的幻灯片。我需要2种不同类型的过渡，基于方向(下一张和上一张幻灯片)。为了获得紧凑的代码，我使用了三元运算符?:
<transition :css="false" @enter="direction ? enterNext : enterPrev">
<h2 :key="currentPage.id">
<NuxtLink
:to="currentPage.to"
:title
浏览 21提问于2021-03-13得票数 0
我很难在网上找到解决这个问题的答案。
我有一个脚本，它以特定的顺序运行我所有的其他脚本。
$x=0;
$z=0;
cd *file path* ;
.\filename1.ps1 ; write-host "$x text $z text";
.\filename2.ps1 ; write-host "$x text $z text";
在每个脚本中，我都有一些选项，可以将1添加到变量$x或变量$z中。
$a=Read-Host
if ($a -eq "Option One") {$x = $x+1}
elseif ($a -eq "Op
浏览 0提问于2018-03-06得票数 2
回答已采纳
1回答
我是VueJs的新手，我正在处理一个表单，只有在模型发生更改时，我才想启用Save按钮。
我最初的想法是compute一个比较初始模型和当前模型的脏函数。
注意:这段代码不是经过测试的，这里只是一个例子。
var app = new Vue({
el: '#app',
data: {a:0, b:'', c:{c1:null, c2:0, c3:'test'}},
initialData: null,
mounted():{ initialData = JSON.parse(JSON.stringify(d
浏览 1提问于2018-09-15得票数 17
回答已采纳
使用VueJS，我需要为每个用户显示不同的颜色。颜色取决于用户设置。
在我的vuetify.js中，我有：
export default new Vuetify({
theme: {
themes: {
light: {
primary: user.colorMain ? user.colorMain : '#F39200',
当我使用：
$vuetify.theme.themes.light.primary
在我的部件里。
但是，我也需要在我的variable.scss文件中覆盖Sass变量：
$primary-color: #f392
浏览 4提问于2022-04-12得票数 1
3回答
我有两个单文件组件，每个组件都有一个指定的路由。Setup.vue是收集一些数据并将其转发给Timer.vue的基本形式，Timer.vue需要一些支持。有没有一种方法可以将道具推送给它，而不把它们作为url属性传递？
Setup.vue
<script>
export default {
...
methods: {
startTimer() {
this.$router.push({
name: 'timer',
params: {
development: this.devel
浏览 0提问于2019-04-23得票数 0
回答已采纳
我是VueJs的新手。我想用逗号(，)分割一个字符串，并将其保存到另一个变量。此字符串来自API。这是我的API，我正在使用json服务器
"featured-property": [
{
"id": "1",
"name": "Property 1",
"address": "Address Property 1",
"geo": "0.5307596, 101.4461512"
浏览 6提问于2021-02-19得票数 0
回答已采纳
我对localStorage和使用它感到有点困惑。我有一个Statistic.vue，它在结尾处显示模态。
Statistic.vue
<template>
<p class='modal'>{{numberOfGames}}<p>
<template/>
<script>
export default {
name: "GameStatistic",
data() {
return {
numberOfGames: localStorage.g
浏览 4提问于2022-08-23得票数 0
好吧，这并不是我所知道的一些干净的代码。我在这里尝试做的是，当我的v-for中的索引达到3时，我想在我的工作日数组中打印出一天。 现在在我的方法中，afficherJour(索引)函数i似乎没有递增(它总是保持在0)，所以每次我的索引达到3%3 =0时，它只打印星期一，但我想要星期一，星期二，等等。 有什么办法解决这个问题吗？谢谢！ <template>
<div id="app">
<div>
<h1>
<span>Weather</span>
<
浏览 10提问于2020-03-16得票数 0
回答已采纳
<button @click="verifyOtp" id="verifybtn"> VERIFY </button>
<input
type="text"
id="mobile"
v-model="mobile"
v-model.trim="
浏览 58提问于2021-04-03得票数 0
回答已采纳
1回答
我希望根据数据库中特定数据的存在来选中我的复选框。我在laravel中使用vuejs。以下是我的checkbox代码：
<input type="checkbox" value="{{$complaint->complaintID}}" :checked="CheckCECDecisionSigned({{$complaint->complaintID}})" disabled>
下面是我的vuejs方法：
methods: {
CheckCECDecisionSigned: function (compl
浏览 1提问于2016-08-09得票数 0
1回答
有一个Vuejs代码，我想在本地运行()
当我试图在本地运行它时，我得到的结果与代码页不同。
vs
我在本地的代码：
script.js
const app = Vue.createApp({
data() {
return {
currentTab: 'Home',
tabs: ['Home', 'Posts', 'Archive']
}
},
computed: {
currentTabComponent() {
return 'tab
浏览 1提问于2020-12-16得票数 0
回答已采纳
我试图让用户重置或关闭一个给定的服务器从一个应用程序。我现在就在界面上工作，想要给用户消息说明正在发生的事情。我显示在数据对象中定义的一条消息，以指示所采取的操作。我用setTimeout来切换重置.带有重置消息的消息。请参见下面的方法。
systemReset: function(){
this.message = this.server + ': Resetting';
setTimeout(function(){
this.message = this.server + ':
浏览 5提问于2017-07-25得票数 17
回答已采纳
需要任何人的帮助。
如何获取在Laravel中的.env文件下定义的环境变量，我希望在vuejs组件中访问这个环境。
.env file
SECREAT_KEY=<My secreat key here>
我想在登录组件下访问相同的变量。
export default {
name: 'login',
data () {
return {
login: {
username: '',
浏览 0提问于2018-12-04得票数 1
回答已采纳
1回答
我有一个接口，在这个接口中，我得到一个弹出搜索选项卡，其中包含一个可编辑的列表。
但是，在单击此列表编辑按钮后，我不知道将数据获取到主界面进行编辑的方法。
简单地说，我需要的是将当前项的id作为一个parameter.if传递给主编辑视图，任何人都可以帮助我。
我的代码：
这是我的TS文件：
Editmodeclose(value: any) {
let ItemID: number = this._activatedRoute.snapshot.params['code'];
alert(this.userid);
alert(this.s
浏览 1提问于2018-10-08得票数 0
我的问题是，我有一个带有setter和getter的计算属性，类似于：
computed:{
dataComputed:{
get: function () { return this.dataProps},
set: function (newValue) {
//here my problem
this.dataProps= Object.assign({}, newValue);
}
}
},
但我的问题是，我
浏览 3提问于2017-10-03得票数 0
回答已采纳
2回答
如何在Vuejs中调用2个变量？
、、、、
我用的是Vuejs。
我想调用两个变量。
我该怎么办？
这些是我真正的密码。
(我想添加一个代码，用于在具有类.close的模式中隐藏(x)按钮)
我编辑了我之前的帖子。很抱歉。
window.app = new Vue({
el: '#vuelayoutdiv',
data: {
text: null
},
methods: {
submitToSignIn: function () {
window.location.href = "/{Contoller}/{Index
浏览 18提问于2019-11-15得票数 0
回答已采纳
我已经查过了，但还有一件事我不清楚：
我能否在事件集线器上传递一个参数，但我需要参数为值，而不是存储值的变量。例如：eventHub.$emit('test_emit', true)和在test_emit上调用的方法应该将其参数设置为true。
浏览 0提问于2019-01-18得票数 1
回答已采纳
我的应用程序使用Laravel和VueJs，我想集成一个角色和权限部分，并为此使用。
在应用程序中，每个用户可以有多个角色(比如: admin、教师、编辑器)，每个角色都有一些权限。
我尝试了一些来自的东西，Shuyi的答案，但是我得到了一些错误。
问题是如何检查VueJS中的角色
控制器
<?php
namespace App\Http\Controllers;
use Illuminate\Http\Request;
class TeachersController extends Controller
{
function check($permissionName)
浏览 3提问于2020-07-12得票数 1
我在学习使用武克莱webpack。我希望我的应用程序能够使用dev服务器访问PHP后端API。后端API由Apache托管在同一台计算机上。
对于我的测试，我创建了一个非常简单的PHP脚本，我可以使用url http://localhost/php/script.php访问它。
<?php
header("Content-type:application/json");
$data = [
'type' => 'Car',
'brand' => 'Ford',
'color&#
浏览 1提问于2018-02-05得票数 1
回答已采纳
我正在创建一个按钮来过滤用户购买或拥有的数据(游戏)，尽管在我的代码中，它只过滤没有设置布尔属性的数据。
编辑:在ref中添加了更多关于带有防火墙数据的代码的详细信息。
<!-- This is the button I'm having trouble with -->
<v-tooltip right>
<v-btn small flat color="grey" @click="toggleHave(true)" slot="activator">
&l
浏览 2提问于2019-07-17得票数 0
回答已采纳
1回答
我用键和JSON数据将一些设置存储在数据库中，但是当我从Laravel获得这些设置时，它会返回一个数组，这将成为将数据重新分配到输入字段的一项繁重工作。我想知道是否有更简单的方法。
到目前为止，我已经尝试迭代并使用switch语句来识别键并重新分配它们。但问题是我无法访问循环中的VueJS数据变量。
下面看一下数据库表：
下面是我在Vue中使用的对象：
helpful_notification: {
email: false,
sms: false,
push: false,
},
updates_newsletter:
浏览 0提问于2019-04-06得票数 1
回答已采纳
因此，在一个表中，我使用Vue.js & v-for显示多个“预订”。
表中的每一行都有一个由以下内容组成的表单：
<tr v-for="reservation in reservations" :key="reservation.id">
<td>
<form @submit.prevent="sendAnswer" method="post" >
<select name="
浏览 0提问于2018-06-12得票数 1
回答已采纳
1回答
请帮助我，如何使用Vue.js提出的请求发布数据
这是Vue的代码
let tests = {
cat1: {
name: 'Auth',
items: {
authorize2: {
name: 'Successful',
subname: '',
request: {
method: 'POST',
浏览 3提问于2018-09-27得票数 0
回答已采纳
我在VueJS里有Tabs。单击其中一个选项卡后，我想更改选项卡标题中的图标。我不能得到好的图标，只有在两次操作之后。在函数changeMap中，我用console.log()得到了很好的图标，但在实际中没有变化。这是我的代码：
<b-tabs @input="checkMap">
<b-tab active>
<template slot="title">
<b-img :src="tab_tel"/>
<span class
浏览 0提问于2018-10-27得票数 0
我在laravel中尝试这个vuejs应用程序，它是一个简单的应用程序，我在那里获取数据，然后尝试用laravel显示它，这是我的messages.vue
Messages.vue
<template lang="html">
<div id="frame2">
<div id="contacts">
<ul>
<div v-for="privsteMsg in privsteMsgs">
<li class=
浏览 1提问于2018-06-15得票数 0
扫码
添加站长 进交流群
领取专属 10元无门槛券
手把手带您无忧上云
相关资讯
热门标签
云服务器
ICP备案
对象存储
即时通信 IM
实时音视频活动推荐
腾讯云开发者
