我想有条件地在文本字段中应用文本颜色类。我想要的课程是red--text这样的：
:class="{ red--text: myModel.someBool }"
...但这会导致解析错误。我认为问题与类名有关，因为这有效：
<v-text-field
v-model="myModel" label="My Text"
:class="{ red: myModel.someBool }"
></v-text-field>
...但我想为文本着色，而不是整个字段。
将所需的类名括在引号中'red--text'可以防止解析错误，但对颜色没有影响。
有没有办法得到我想要的？
我想有条件地执行异步函数,但我想我错过了正确的语法来说出我想要的东西.
this.doUpToThreeThings = function(skipTheMiddleStep) {
return doFirstThing().then(function (result) {
if (skipTheMiddleStep) {
return doThirdThing();
} else {
return doSecondThing();
}
}).then(function (result) {
if (skipTheMiddleStep) {
return "ok"; // return what?
} else {
return doThirdThing();
}
});
}
当我们到达第二个时,我不知道第一个块是否做了中间步骤,所以我不得不重复这个条件.第二个块看起来很奇怪:它应该说,如果跳过中间步骤,那么做第三件事,但既然我们知道前一个块必须完成第三件事,它就会返回.所以我必须重复这个条件,然后在第二个中编写看起来很错误的代码.
我意识到我可以编写一个名为doSecondAndThirdThings的函数,只是从第一个块中的条件调用它,但那不是真的DRY,它只是隐藏非DRYness.(或者我错了？)
另外,对于在"ok"分支上返回完成的承诺,我仍然有点困惑.它是正确的,或者我应该说像解决方案？ - 谢谢
我想要我的视图，使用作为道具传递的 id 来查找商店中对象的属性。存储中的对象是异步出现的，因此该对象可能不会立即出现。我希望视图对对象的最终外观做出反应。
<template>
<div>
<h1>{{ title }}</h1>
</div>
</template>
<script>
export default {
props: ['id'],
computed: {
widget () {
let path = `widget/${this.id}`
return this.$store.state.widgets[path]
},
title () {
let widget = this.widget
return (widget) ? widget.data().fullName : 'nothing to see here'
}
}
}
</script>
使用 vuex 调试工具，我可以观察商店小部件对象从空开始，然后使用 进行设置widgets: { 'widgets/someId': { ... } }，但我的 vue 似乎没有接受更改。标题仍然是==“没什么……”。
我尝试制作这些方法，但得到了相同的行为。我还尝试更换商店中的整个widgets物体，而不是一次更换一个道具（我认为这是一个要求），但仍然没有运气。
我认为我的问题与这个问题非常相似，但答案太简洁了。它只是说“使用数据项”，但我真的不知道那是什么或如何使用它（或者为什么这会让 vue 反应）。
我有这样的标签...
<v-tabs v-model="tab" v-on:change="tabbed()" fixed-tabs>
<v-tab ripple>Tab A</v-tab>
<v-tab ripple>Tab B</v-tab>
<v-tab ripple>Tab C</v-tab>
// tab items, etc
我想要 URL 路径来确定选项卡，并且想要通过选项卡更改来更改路径。我无法使用路径执行此操作（因为我是新的），但我认为我可以通过查询来近似我想要的内容，例如/mypath?tab=2
data: () => ({
tab: null
}),
methods: {
tabbed () {
console.log(`we tabbed, now tab is ${this.tab} and route is ${JSON.stringify(this.$route.path)}`)
this.$router.replace({ path: this.$route.path, query: { tab: this.tab } })
}
},
created () {
console.log(`tab is ${this.$route.query.tab}`)
this.tab = this.$route.query.tab
}
我认为这可以解决问题：在创建时，从查询中获取选项卡并设置选项卡模型。在选项卡更改时，从选项卡模型获取选项卡并设置查询。但是，当我导航到/mypath?tab=2、 或任何选项卡时，我最终会到达第 0 个选项卡并获得如下控制台输出：
选项卡为 2
我们使用选项卡，现在选项卡为 0，路线为“/mypath”
有关安装的某些操作会将选项卡更改回零？
我可以通过路由来实现这一点吗？这样我就可以转到"/mypath/tab-a"
我至少可以通过查询来实现这一点吗？看起来我的代码是正确的，但我不明白为什么它无法工作
有没有办法制作这样的内插文本：
<div>{{htmlReturningFn()}}</div>
然后：
methods: {
htmlReturningFn () {
return `there are <strong>BOLD</strong> words in this text`
}
}
当然，希望是这样的：
这段文字中有粗体字。
我知道我可以为模板中的不同部分设置样式，但是我要设置样式的文本很长，需要加粗的单词是无法预测的。
我想制作一个在网络和移动设备上看起来不错的引导表单.似乎直截了当的标记效果不佳.这是一个有角度的应用程序,但我不认为...
一个问题是,如果我尝试通过div包含多个字段以应用背景颜色,则不包含字段,从div的左侧溢出.
我认为另一个问题是,字段显示在移动设备上,左右边距为0px,看起来不太好.
这是标记:
在索引.html:
<html lang="en" ng-app="myApp">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">
<title>My BS App</title>
<link rel="stylesheet" href="http://netdna.bootstrapcdn.com/bootstrap/3.1.1/css/bootstrap.min.css">
<link rel="stylesheet" href="css/app.css"/>
</head>
<body>
<div class="container">
<div class="header">
<h3 class="text-muted">My BS App</h3>
</div>
<div class="row">
<div class="col-md-6">
<div ng-view></div>
该角度视图指令导致表单包含如下...
<form class="form-horizontal" name="parentForm" role="form" novalidate mb-submit="save()">
<fieldset>
<div ng-repeat="parent in family.parents()">
<legend>{{parent.firstName}} {{parent.lastName}}</legend>
<div class="row">
<div class="form-group">
<div class="col-md-10">
<div class="checkbox">
<input type="checkbox" ng-checked="parent.list" ng-model="parent.list">List parent</input>
</div>
</div>
</div>
</div>
<div style="background-color:red;">Why don't I contain the …我希望我的 firebase 网络应用程序上传一个文件，并且我希望有一个云函数来发现这个文件并根据其内容创建一个数据库对象。这是我尝试过的许多变体中的最后一个变体......
const functions = require('firebase-functions');
const admin = require('firebase-admin');
const { Storage } = require('@google-cloud/storage');
admin.initializeApp();
const db = admin.firestore();
exports.onStorageFinalize = functions.storage.object().onFinalize((object) => {
const storage = new Storage();
const bucket = storage.bucket('my app's storage bucket name');
return bucket.file(object.name).download(function (err, contents) {
// problem: no err, no contents, set doesn't run just a warning about promises!
const result = `got err=${err}, contents=${contents}`
return db.collection('myCollection').doc().set({
result: result
})
});
});
上传了非常小的文件，并运行此触发器。当我不尝试获取文件的内容时，数据库对象创建得很好（使用文字字符串而不是文件结果）。
但是当我如上所示运行它时，首先我收到一条警告：
onStorageFinalize：函数返回未定义、预期的 Promise 或值
那是错误的。文档file().download()说它返回一个承诺......而且，更重要的是，数据库 …
google-cloud-storage firebase google-cloud-functions google-cloud-firestore
javascript ×4
vue.js ×4
angularjs ×2
html ×2
vuetify.js ×2
css ×1
firebase ×1
promise ×1
vuex ×1