小编nic*_*iel的帖子

在样式组件中处理悬停的最佳方法是什么.我有一个包裹元素,当盘旋时会显示一个按钮.

我可以在组件上实现一些状态并在悬停时切换属性但是想知道是否有更好的方法来使用styled-cmponents.

像下面这样的东西不起作用,但是理想的:

const Wrapper = styled.div`
  border-radius: 0.25rem;
  overflow: hidden;
  box-shadow: 0 3px 10px -3px rgba(0, 0, 0, 0.25);
  &:not(:last-child) {
    margin-bottom: 2rem;
  }
  &:hover {
    .button {
      display: none;
    }
  }
`

当我通过 webpack 运行我的节点开发服务器时，我的浏览器打印出一条超级无用的消息“无法获取 /”。我正在使用以下内容构建 Vuejs 应用程序：

• VueJs 的结构由这个Vue 模板指示，我的节点脚本与默认命令相同
• 基于Vue Loader 的Webpack 配置
• 通过Vue Router处理的路由

我知道这不是什么大不了的事情，但是知道是什么触发了这个错误（Node？Webpack？Vue Router？），它会为我指明正确的方向，我将不胜感激。

使用yarn.

我拥有其中一个依赖项（让我们称之为my-problematic-package）并已将 peerDependency 设置为如下：

"peerDependencies": {
  "react": "0.14.x - 16.x.x",
  "react-dom": "0.14.x - 16.x.x"
}

然后我将包包含在我的项目中，并为依赖项定义了以下内容：

"dependencies": {
  ...
  "react: "^16.0.0",
  "my-problematic-package": "^1.1.0" // Latest with react as devDependency
}

然后我在运行时得到以下信息yarn：

warning > my-problematic-package@1.1.0" has unmet peer dependency "react@0.14.x - 16.x.x".

似乎合法但不起作用，欢迎提出任何建议。

纱线版本：1.3.2

NPM 版本：5.5.1

我正在SilverStripe建立一个非常简单的在线商店.我正在写一个功能,从购物车中删除一个项目(order在我的情况下).

我的设置:

我的端点将JSON返回到视图以便在ajax中使用.

public function remove() {

    // Get existing order from SESSION
    $sessionOrder = Session::get('order');

    // Get the product id from POST
    $productId = $_POST['product'];

    // Remove the product from order object
    unset($sessionOrder[$productId]);

    // Set the order session value to the updated order
    Session::set('order', $sessionOrder);

    // Save the session (don't think this is needed, but thought I would try)
    Session::save();

    // Return object to view
    return json_encode(Session::get('order'));
}

我的问题:

当我将数据发布到此路由时,产品将被删除但只是暂时删除,然后下次调用remove时,前一项将返回.

例:

订单对象:

{
  product-1: {
    name: 'Product …

我正在使用gulp-iconfont将一组 svg 图标转换为 woff 字体。

在图标转换为字体之前，它看起来如下：

它如何出现在 woff 文件中：

我的吞咽任务如下：

gulp.task('icon-font', function() {
  gulp.src([paths.icons + '*.svg'])
    .pipe(iconfont({
      fontName: 'icons',
      formats: ['woff'],
      timestamp: timestamp,
      appendUnicode: true
    }))
    .on('glyphs', function(glyphs, options) {
      gulp.src(paths.templates + '/_icons.scss')
        .pipe(template({ glyphs: glyphs, timestamp: timestamp }))
        .pipe(gulp.dest(paths.styles));
    })
    .pipe(gulp.dest(paths.fonts + 'icons/')
  );
});

我的 Illustrator 导出设置：

SVG代码：

<?xml version="1.0" encoding="utf-8"?>
<!-- Generator: Adobe Illustrator 19.1.0, SVG Export Plug-In . SVG Version: 6.00 Build 0)  -->
<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
     viewBox="-183 185 32 …

我在绝对定位的元素上放置了一个悬停过渡。悬停状态将框阴影应用于标题元素以模拟它填充区域（为了避免无法从设置为自动的属性转换的事实）。

仅在 Chrome 中，当转换反转时，背景图像上会留下一堆油漆线。显示在下图中。左起第二个图块应用了悬停状态。

注意：如果我.heading通过其他方式（通过调整高度、顶部、填充）将元素拉伸到顶部，也会发生这种情况；

我对每个项目的标记如下：

<li class="item appear">
    <a href="/link-to-page">
        <div class="thumbnail" style="background-image: url('/path-to-image.jpg')"></div>
        <h4 class="heading category-icon">{$Title}</h4>
    </a>
</li>

我的 SCSS（有一些波旁威士忌混合）如下：

.tiles {
    .item {
        height: 15rem;
        &.seen {
            @include appear;
            &:hover {
                .heading {
                    padding: 3rem 1rem;
                    background-color: rgba(color(blue), 0.9);
                    box-shadow: 0 -5rem 0 5rem rgba(color(blue), 0.9);
                    @include transition(all 0.5s 0s);
                    &:before {
                        opacity: 1;
                        @include transition-delay(0.5s);
                        @include transform(none);
                    }
                } 
            }
        }
        a {
            position: absolute;
            top: 0;
            right: 0;
            bottom: 0;
            left: …

我在 ZSH 中设置了一个功能，可以快速导航到我的 ~/Sites 目录中的文件夹。

site() { cd ~/Sites/"$1"/website/; }

因此，如果我输入site clientsite它将 cd 到 ~/Sites/ clientsite /website/，这里没有发生太复杂的事情。

我想知道如何根据我内部的文件夹自动完成此操作~/Sites/。

因此，当我输入时，site cli[HIT TAB]它会自动完成为site clientsite.