我正在尝试link根据predn上mdn的文档使用标签的preload rel值来预加载视频。
在我的index.html文件中,我将以下内容添加到头部:
<link rel="preload" as="video" type="video/mp4" href="video/2_1.mp4" />
Run Code Online (Sandbox Code Playgroud)
在chrome中,此方法工作正常,可以预加载文件而不会出现问题。
当我在台式机或iphone上在safari 11.3中打开页面时,出现控制台错误消息:
必须有一个有效的
as价值
根据文档的“可以预加载哪些类型的内容”部分,其中包含有效值的列表,我肯定使用的是正确的video类型。
我检查了链接标签上的有关移动Safari浏览器预加载的mdn文档,并显示了“兼容性未知”问号。我还检查了caniuse,它似乎表明只要我的移动Safari浏览器版本为11.3,我就可以使用它。
手机和台式机都位于safari 11.3,所以我不确定为什么会出现此错误。
有什么想法/见解吗?
是否可以通过将两个字符串连接在一起形成名称来设置变量?
如果可能的话,我想根据用户点击的对象的类名确定要设置的变量.我知道我可以硬编码一堆if/else if语句,但如果我可以间接引用变量,那将会非常酷.我在想这样的事情:
var owner_read;
var group_read;
function setVariableIndirectly(object){
var second = object.className; // returns "read"
var first = object.parentElement.className; // returns "group"
first + "_" + second = "set this as the new variable";
}
Run Code Online (Sandbox Code Playgroud)
有没有办法做到这一点?
编辑:
这是数据来自的html.
<p class="owner">
<span class="read" onclick="permissionClick(this)">r</span>
<span class="write" onclick="permissionClick(this)">w</span>
<span class="execute" onclick="permissionClick(this)">x</span>
</p>
Run Code Online (Sandbox Code Playgroud) 我正在尝试使用webpack-dev-server代理配置将api请求发送到外部域,我似乎无法使其正常工作.
这是我的配置:
var path = require('path')
module.exports = {
entry: './client/index.js',
output: {
filename: 'bundle.js',
path: path.resolve(__dirname, 'public/assets'),
publicPath: 'assets'
},
devServer: {
contentBase: 'public',
proxy:{
'/api/v1*': {
target: 'http://laravelandwebpack.demo/',
secure: false
}
}
}
}
Run Code Online (Sandbox Code Playgroud)
因此,/api/v1...只要我的应用程序向uri 发出请求,它就应该发送该请求http://laravelandwebpack.demo.
在我的Vue应用程序中,我正在使用它vue-resource来发出请求,并且我使用所需的uri前缀默认所有请求:
var Vue = require('vue')
Vue.use(require('vue-resource'))
new Vue({
el: 'body',
http: {
root: '/api/v1', // prefix all requests with this
headers:{
test: 'testheader'
}
},
ready: function (){
this.$http({
url: 'tasks',
method: 'GET'
}).then(function (response){
console.log(response); …Run Code Online (Sandbox Code Playgroud) 我有一个自定义脚本,我想将其包含在我的 nuxt 项目中。
问题是,这个脚本需要在dom 加载之前包含在内。它包含此特定项目的覆盖。
我的资产文件夹由脚本子文件夹构成:
在我的 nuxt.config.js 文件中,我有以下内容:
export default {
css: ["~/assets/css/main.scss"],
head: {
script: [
{
src: "https://cdnjs.cloudflare.com/ajax/libs/aframe/1.0.4/aframe.min.js",
src: "_nuxt/assets/scripts/bundle.js", // this is the script that I'm trying to include
},
Run Code Online (Sandbox Code Playgroud)
_nuxt/在查看了如何成功包含其他一些资产后,我添加了
在 dom 加载之前我们需要发生的所有事情都已经捆绑在文件中,尽管这是非常规的,但如果我们能够加载它,这将是可行的。
我已经浏览了有关head此配置或实际 .vue 文件中的属性的 nuxt 文档,但它讨论的是外部资源,而不是项目本地的资源。
我如何正确地将此文件包含在 nuxt 的头部中?
另外,如果有一种正确的方法将该包的源代码与主 nuxt js 代码分开,以便它可以正确地通过 nuxt/tsc,我当然愿意。
是否可以从网站级别禁用safari包含的工具提示?
我一直在寻找,我看到有很多方法可以为你的本地机器禁用它,但如果我有自己的自定义工具提示,我正在创建(我正在创建一个在Sencha extjs项目中格式化的表)我可以告诉Safari的webkit不显示它的工具提示?
如果从网站上无法做到,那么有没有办法控制Safari工具提示中显示的文字?
目标是在将鼠标悬停在表格中的字段上时,显示包含记录详细信息的工具提示.
我已经有一个字段,其中包含我用于Sencha项目工具提示的详细信息.如果我可以告诉Safari(或任何其他强制它自己的工具提示到网站上的浏览器)使用该信息,它也可以工作.
我有一个项目使用Sentinel包为Laravel.
不久前,我问了一个关于扩展捆绑包中提供的模型的问题.我接受的答案有效,但需要在vendor文件夹中编辑软件包的代码.
从那以后,我运行了一个composer update命令,我应用的更改被覆盖了(这并不奇怪).
我对laravel现在如何工作了解得更多,所以我能够追溯我的应用程序引用捆绑服务的终点.在我的config/app.php文件中,我有服务提供者参考:
'Sentinel\SentinelServiceProvider',
Run Code Online (Sandbox Code Playgroud)
该SentinelServiceProvider服务有一个register方法来注册RepoServiceProvider哪个是我需要覆盖的类.
我的计划是创建两个新文件:ExtendedSentinelServiceProvider.php和ExtendedRepoServiceProvider.php.
在ExtendedRepoServiceProvider.php文件中,我可以用我的自定义User类替换用于用户存储库绑定的类:
// Bind the User Repository
$app->bind('Sentinel\Repo\User\UserInterface', function($app)
{
return new ExtendedSentryUser( // This is my custom model that I want the ExtendedRepoServiceProvider to use
$app['sentry']
);
});
Run Code Online (Sandbox Code Playgroud)
在ExtendedSentinelServiceProvider.php文件中,我将RepoServiceProvider用我新修改的ExtendedRepoServiceProvider类替换现有的类引用:
public function register()
{
$loader = \Illuminate\Foundation\AliasLoader::getInstance();
$loader->alias('Sentry', 'Cartalyst\Sentry\Facades\Laravel\Sentry');
$repoProvider = new ExtendedRepoServiceProvider($this->app); // This would be my new …Run Code Online (Sandbox Code Playgroud) 我的应用程序中有几个表的迁移.表格是:
people每个其他表之间存在一对多的关系.
// The people table definition
Schema::create('people', function (Blueprint $table) {
$table->uuid('id');
$table->primary('id');
...
$table->timestamps();
});
// the skill table definition with the foreign key constraint referencing people
Schema::create('skills', function (Blueprint $table) {
$table->uuid('id');
$table->primary('id');
$table->uuid('person_id');
$table->foreign('person_id')
->references('id')->on('people')
->onDelete('cascade');
...
$table->timestamps();
});
Run Code Online (Sandbox Code Playgroud)
当我通过迁移创建迁移时artisan意外创建了skills迁移文件people.
这导致了一个问题,因为当您运行时php artisan migrate,文件将按时间戳顺序触发,如果在定义外键约束之前未建立主键,则会出现错误,例如
文件:
2016_02_24_174227_create_people_table.php
Run Code Online (Sandbox Code Playgroud)
将在文件后触发:
2016_02_24_174221_create_skills_table.php
Run Code Online (Sandbox Code Playgroud)
因为skills文件名称中的时间戳前缀较小(17:42:21在17:42:27之前).这意味着外键约束skills正在寻找people尚不存在的主键.
所以为了解决这个问题,我将文件重命名2016_02_24_174227_create_people_table.php为2016_02_24_170000_create_people_table.php. …
我正在尝试从命令行在 vim 中打开 3 个文件。我想要左边的一个文件与其他两个文件垂直拆分,其余两个文件将水平拆分。
| 2
1 |---
| 3
Run Code Online (Sandbox Code Playgroud)
我知道我可以使用该命令vim -O Notes.markdown -O Plan.markdown在垂直拆分中打开前两个文件,一旦进入,我可以切换到第二个文件,ctl w然后使用该命令split History.markdown来实现我想要的,但我希望能够从命令行在一行中完成所有操作。
我尝试使用vim -O Notes.markdown -O Plan.markdown -c split History.Markdown接近的命令,但它拆分了第一个和第二个文件,在垂直拆分的右侧留下了第三个文件。
我无法弄清楚的是,我是否可以告诉 vim 使用ctl命令行中的密钥,以便我可以运行类似... -c <switchwindowcommand> | split History.markdown. 有没有办法指定控制键?
我正在尝试使用列系统在Bootstrap中构建一个导航栏,我遇到了一些问题,我不确定我做错了什么.
我想最终得到一个看起来像这样的导航栏:

我想要一行左边对齐的列带有徽标,右边的对齐列带有用户按钮,然后是第二行带有中心对齐的按钮.
我的想法是我可以使用类"col-lg-6 col-md-6"创建两个div,一个用于徽标,一个用于用户按钮.这两个将创建第一个12列的行,这将强制跟随整个新行的标记.
但是,当我尝试这样做时,我最终会将所有内联运行并且无序运行.

我知道我可以通过添加我自己的自定义css(这是我能够模拟第一个屏幕截图)来做到这一点,但我的首选是坚持使用bootstrap列系统所以我的ad-hoc css不事情发生了.我还想了解我做错了什么(这是我使用bootstrap的第一个项目,所以我仍然试图克服学习曲线).
这是我的演示页面的代码:
HTML
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Bootstrap 101 Template</title>
<!-- Bootstrap -->
<link href="css/bootstrap.min.css" rel="stylesheet">
<link href="css/additions.css" rel="stylesheet">
<!-- HTML5 Shim and Respond.js IE8 support of HTML5 elements and media queries -->
<!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
<!--[if lt IE 9]>
<script src="https://oss.maxcdn.com/libs/html5shiv/3.7.0/html5shiv.js"></script>
<script src="https://oss.maxcdn.com/libs/respond.js/1.4.2/respond.min.js"></script>
<![endif]-->
</head>
<body>
<div class="navbar navbar-default navbar-fixed-top">
<div class="container-fluid"> …Run Code Online (Sandbox Code Playgroud) 我开始学习一些新的前端工具,特别是Vue.js,Gulp,Node,Babel和Browserify.
我已经完成了所有工作,但我遇到了一个问题,我为我的应用程序创建的Vue实例不是全局的,因此(我假设)我无法访问我的浏览器的Vue devtools.
在我的gulpfile中,我有一个捆绑javascript应用程序的任务:
gulp.task('build-js', function (){
return browserify('src/javascript/app.js')
.transform(babelify, { presets: ['es2015'] })
.bundle()
.on('error', function (e){
console.log(e.message);
this.emit('end');
})
.pipe(source('bundle.js'))
.pipe(gulp.dest('public/javascript'));
});
Run Code Online (Sandbox Code Playgroud)
在我的app.js文件中,我像这样实例化我的Vue实例:
var Vue = require('vue');
Vue({
el: '#app',
data:{
message: 'Worked!!!'
}
});
Run Code Online (Sandbox Code Playgroud)
作为测试,相关的html看起来像这样index.html:
<body>
<div id="app">
<h1>{{ message }}</h1>
<input v-model='message'></input>
</div>
<script type="text/javascript" src="javascript/bundle.js"></script>
</body>
Run Code Online (Sandbox Code Playgroud)
代码有效; 我可以键入我的绑定输入对象并查看标题中镜像的结果,但我无法访问Vue devtools:
并且扩展名已经安装并启用:
我一直在寻找周围的解决方案,并已看到帖子里的人说的Vue分配给window或global对象,但结合了Vue的图书馆,不是我的特定实例.
有没有办法让我的Vue实例全局化?我误解了这应该如何运作?
vue.js ×3
javascript ×2
php ×2
artisan ×1
browserify ×1
css ×1
gulp ×1
html ×1
indirection ×1
laravel ×1
laravel-4 ×1
laravel-5.2 ×1
nuxt.js ×1
preload ×1
proxy ×1
safari ×1
split ×1
tooltip ×1
variables ×1
vim ×1
vue-resource ×1
webkit ×1