小编Ale*_*lex的帖子

如何垂直居中包含在文本中的文本<span>？在<span>必须min-height的45px.这是我想象的:

--------                  -------
text

                --->      text   


--------                  -------

我尝试了本文中的vertical-align方法.他们都没有工作

我的Vue / vuex / vue-router + Firebase应用程序中有一个难题。引导程序代码应初始化Firebase以及Vuex中已登录的用户（如果有）：

new Vue({
  el: '#app', router, store, template: '<App/>', components: { App },
  beforeCreate() {
    firebase.initializeApp(firebaseConfig)
      // Because the code below is async, the app gets created before user is returned...
      .auth().onAuthStateChanged(user => {
        this.$store.commit('syncAuthUser', user) // this executes too late...
      })
  }
})

在我的路线中，我有

{ path: '/home', name: 'Home', component: Home, meta: { requiresAuth: true } }

以及

router.beforeEach((to, from, next) => {
  let authUser = store.getters.authUser // this is not set just …

我正在寻找一种智能的方法来处理使用Vue Router的页内锚点.考虑以下:

<router-link to="#app">Apply Now</router-link>
<!-- some HTML markup in between... -->
<div id="app">...</div>

文档中描述的"滚动到锚点"行为可以正常工作,除了:

• 当您单击锚点时,它会将您带到div id="app".现在滚动从div背面滚动到锚点并尝试再次单击它 - 这次你不会跳到它div.实际上,锚将保留类router-link-active,URL仍将包含哈希值/#app;
• 通过上述步骤,如果刷新页面(URL仍将包含哈希)并单击锚点,则不会发生任何事情.

从UX角度来看,这是非常不幸的,因为潜在客户必须再次手动滚动才能到达应用程序部分.

我想知道Vue Router是否涵盖了这种情况.作为参考,这是我的路由器:

export default new VueRouter({
    routes,
    mode: 'history',
    scrollBehavior(to, from, savedPosition) {
        if (to.hash) {
            return { selector: to.hash }
        } else if (savedPosition) {
            return savedPosition;
        } else {
            return { x: 0, y: 0 }
        }
    }
})

在使用Laravel和Vue.js 构建一个小型SPA时,我遇到了CSRF的多个困难:

• 我index.html用作唯一的视图,其余的是vue-router使用单个文件组件(即.vue文件)处理
• 因为我在前面没有使用PHP或Blade,所以我不能注入csrf_token()我的视图.即使我这样做,令牌也会最终到期,但由于应用程序没有(或很少)页面刷新,它不知道令牌是否发生了变化,并且它最终无法用旧的方式发出AJAX请求代币
• 一些答案建议在cookie中传递令牌,然后用JS检索它.这种方法遇到与上述相同的问题 - 当令牌改变时,SPA永远不会得到通知
• 我可以挖掘Laravel的内部工作,并在每次令牌改变时抛出一个事件; 前端可以使用Laravel Echo来听取变化,但随后问题提出,是否值得打扰？
• 最后,我被建议使用JWT; 但是,据我所知,JWT用于身份验证,而CSRF - 用于每个请求,无论HTTP动词或意图如何.

考虑到最后两点,您认为在Laravel SPA中使用CSRF令牌是否必要/可取？如果是这样,最好的实现是什么(带有令牌的cookie,返回令牌的专用路由,或其他)？如果没有,有哪些替代方案？

我有以下内容routes.php:

Route::get('test/foo', 'TestController@index');

Route::get('test/bar', 'TestController@index');

Route::get('test/baz', 'TestController@index');

我试图将此减少到以下内容:

Route::get(either 'test/foo' or 'test/bar' or 'test/baz', 'TestController@index');

一种有用的文档方法是在路由中放置一个正则表达式约束:

Route::get('test/{uri}','TestController@index')->where('uri', 'regex for foo, bar, and baz...');

但是,这个解决方案很难看.是不是有一种优雅的方式来表达

{uri} in foo,bar,baz

用Laravel的语言？否则,正则表达式会是什么样子？

谢谢!

PS我已经读过这篇文章,但它不适用于我的3条路线.

每当我拨打电话时/api/v1/posts/1,呼叫都会转发给该show方法

public function show(Post $post) {
    return $post;
}

在PostController.php资源丰富的控制器.如果帖子确实存在,则服务器返回JSON响应.但是,如果后期不不存在,服务器尽管回报显然期待JSON请求返回纯HTML.这是Postman的演示.

问题是API应该返回application/json,而不是text/html.所以,这是我的问题:

1.如果在使用隐式路由模型绑定时发生异常,Laravel是否内置支持自动返回JSON(如show上面的方法,当我们有404时)？

2.如果是,我该如何启用它？(默认情况下,我得到纯HTML,而不是JSON)

如果它不是在每个 API控制器上复制以下内容的替代方法

public function show($id) {
    $post = Post::find($id); // findOrFail() won't return JSON, only plain HTML
    if (!$post)
        return response()->json([ ... ], 404);
    return $post;
}

3.是否有一般用法app\Exceptions\Handler？

4.标准错误/异常响应包含什么？我搜索了这个,但发现了许多自定义变体.

5.为什么JSON响应仍然没有构建到隐式路由模型绑定中？为什么不简化开发人员生活并自动处理这种低级别的烦恼？

编辑

在Laravel IRC的人们建议我单独留下错误响应之后,我留下了一个难题,认为默认情况下标准的HTTP异常会呈现为HTML,而使用API​​的系统应该处理404而不需要查看正文.我希望更多的人加入讨论,我想知道你们会如何回应.

我有一个小的Vue.js SPA,其中包含以下路由器配置,取自文档:

export default new VueRouter({
    routes, // defined above...

    mode: 'history',

    scrollBehavior(to, from, savedPosition) {
        if (to.hash) {
            return { selector: to.hash }
        } else if (savedPosition) {
            return savedPosition;
        } else {
            return { x: 0, y: 0 }
        }
    }
})

考虑主页上的链接:

<router-link to="#services">Services</router-link>

它<div id="services">...</div>按预期跳转到锚元素.但是,当您激活链接,然后滚动#services并刷新页面时,您将不会被带回#services.你将保持在你离开的位置,即使URL仍然有哈希(例如以形式app.dev/#services).

我如何配置路由器,以便在页面加载时,它将用户带到锚元素,假设URL包含其哈希(并且,该哈希对应于有效的现有元素)？

我正在使用mcamara/laravel-localization包，但我不知道如何让它与我的单元测试一起工作。以下两个都失败并显示红色：

// 1. This one results in "Redirecting to http://myapp.dev/en"
$this->get('/')->assertSee('My App Homepage');

// 2. This one results in 404
$this->get('/en')->assertSee('My App Homepage');

在浏览器中，http://myapp.dev返回 302 并重定向到http://myapp.dev/en，这很公平。但是，http://myapp.dev/en返回 200。所以这两种情况在前端都能 100% 正常工作，但不能用于单元测试。

但是，我确实有一些自定义功能，这再次在浏览器中起到了很好的作用。

// in web.php
Route::group([
    'prefix' => app('PREFIX'), // instead of LaravelLocalization::setLocale()
    'middleware' => ['localeSessionRedirect', 'localizationRedirect']],
    function() {
        Route::get('/', function() {
            return view('home');
        });
    }
]);

// in AppServiceProvider.php
public function boot()
{
    // This, unlike LaravelLocalization::setLocale(), will determine …

在ionicons使用npm 安装v3.0.0 之后，将字体导入到我的应用程序时遇到很多麻烦：

// /src/App.vue
@import '../node_modules/ionicons/dist/scss/ionicons.scss';

似乎指向正确的路径，但是，我遇到了很多错误，例如

Cannot find module "../fonts/ionicons.eot?v=3.0.0-alpha.3

显然，此问题源于字体文件，因为例如，上面的文件实际上是ionicons.eot，而不是ionicons.eot?v=3.0.0-alpha.3。

我还在Github上进行了3年的讨论，并尝试了评论中建议的每个装载程序，但没有一个起作用。我是Vue和Webpack的新手，所以我不确定自己做错了什么。

问题：为了能够在vue-loader的应用程序中使用Ionicons（或Font Awesome或其他字体库），我需要做什么？

我在 React 文档中发现了一些差异。在关于Components 和 Props的部分中，他们通过一个功能 Welcome组件的例子来解释，

React 调用Welcome组件 with {name: 'Sara'}as the props。

很公平，因为该组件是一个纯函数。然后在State 和 Lifecycle 中，他们通过类 Clock组件的例子提到，

React 调用Clock组件的构造函数。[...] React 然后调用 Clock 组件的render()方法。

通过阅读文档以及这篇 Medium post和功能组件，

1. 该组件作为带有props对象的函数被直接调用
2. 它返回一个 React 元素，即一个对要渲染的 DOM 元素进行建模的对象
3. React DOM 然后创建一个 DOM 节点并将其插入到“真实”的 DOM 中

流程与基于类的组件不同：

1. 组件类被实例化，对象实例存储在内存中
2. 调用 render 方法并返回 React 元素（对象）
3. React 元素，由它的类实例支持，被 React DOM 用来生成和挂载一个实际的 DOM 节点

根据文章，最大的区别在于“功能组件没有实例”，这意味着它们是直接调用的。React …