小编Pet*_*sma的帖子

我有三个元素,我试图在我的布局中对齐.

首先,我有一个div反馈,然后是搜索输入,然后是div元素的建议.

我希望第一个和最后一个元素的宽度为20%,搜索输入的宽度为60%.使用Flexbox我实现了我想要的.

但是有一个功能可以将所有div增加到最高元素.这意味着当弹出搜索结果时,反馈和建议元素的高度会随着搜索div的增加而产生混乱的布局.

有没有一个技巧不增长具有最高元素的div？只是使div(#feedback和#suggestions)具有内容的高度？

#container_add_movies {
  display: flex;
}
#container_add_movies #feedback {
  width: 20%;
  background-color: green;
}
#container_add_movies #search {
  width: 60%;
  background-color: red;
}
#container_add_movies #suggestions {
  width: 20%;
  background-color: yellow;
}

<div id='container_add_movies'>
  <div id='feedback'>
    Feedback
  </div>
  <div id='search'>
    Search
    <br>Search
    <br>Search
    <br>Search
    <br>Search
    <br>Search
    <br>Search
    <br>Search
    <br>Search
    <br>Search
    <br>
  </div>
  <div id='suggestions'>
    Suggestions
  </div>
</div>

http://codepen.io/alucardu/pen/PPjRzY

使用npm installnpm 安装package.json. 但是看起来您在使用时需要yarn add根据https://yarnpkg.com/en/docs/cli/add指定每个包。

yarn add package-name 安装包的“最新”版本。

这不可能是正确的，对吗？

我有一个功能组件，我从 localStorage 获取一个值并使用该值在状态中设置一个值：

localforage.getItem<string>('sortType').then((value) => {
  setSortType(value)
})

const [sortType, setSortType] = useState('release_date');

当我运行组件时，我得到一个日志：

警告：无法对卸载的组件执行 React 状态更新。这是一个空操作，但它表明您的应用程序中存在内存泄漏。要修复，请取消 useEffect 清理函数中的所有订阅和异步任务。

我已经读到发生这种情况是因为我在localforage.getItem状态上使用了异步方法。但是我还没有找到可以在功能组件中工作的解决方案。

当我在 GitLab CI 环境中运行时，npm run cypress:run出现错误：

您的 configFile 无效：//WebApp/cypress.config.ts 在需要时抛出错误，请检查下面的堆栈跟踪： TypeError [ERR_UNKNOWN_FILE_EXTENSION]: Unknown file extension ".ts" for //WebApp/cypress.config.ts

test:cypress:
  image:
    name: cypress/included:10.3.1-typescript
    entrypoint: ['']
  stage: test
  script:
    - yarn install --frozen-lockfile
    - cd WebApp
    - npm run cypress:run
  rules:
    - *branch

npm run cypress:run如果我从本地WebApp文件夹（位于根目录中）运行，cypress.config.ts则没有问题。当我做一个时也没有问题npx cypress:run

但是，如果我npx cypress run --config-file WebApp/cypress.config.ts在本地从父文件夹运行，我确实会收到错误：

未知的文件扩展名“.ts”

为什么 Cypress 在本地工作正常，但在 CI 上配置文件不正确，有什么想法吗？

我正在按照本指南使用Capistrano在DigitalOcean上部署我的Rails应用程序.

在第5站结束时,我通过以下命令检查服务器可用性:

cap production deploy:check

结果如下:

alucardu@alucardu-VirtualBox:~/sites/movieseat$ cap production deploy:check
cap aborted!
LoadError: cannot load such file -- capistrano/rbenv
/home/alucardu/sites/movieseat/Capfile:18:in `<top (required)>'
(See full trace by running task with --trace)

在我的gemfile中我有:

# Add capistrano
gem 'capistrano-bundler' # for capistrano/bundler
gem 'capistrano-rails' # for capistrano/rails/*

和:

group: :development do
  gem 'capistrano', '~> 3.0', require: false
  gem 'capistrano-bundler', require: false
  gem 'capistrano-rails', require: false
  gem 'capistrano-rbenv', github: 'capistrano/rbenv', require: false
end

在我的Capfile中,我有:

require 'capistrano/rbenv'
# require 'capistrano/chruby'
require 'capistrano/bundler'
require …

createContext我正在尝试使用React API来构建上下文：

import React, { useState, createContext } from 'react';

export const MovieContext =  createContext();

export const MovieProvider = (props) => {
  const [movies, setMovies] = useState(
    [
      {
        original_title: 'name of movie',
        poster_path: 'path_to_poster',
        id: 1
      }
    ]
  );
  return (
    <MovieContext.Provider value={[movies, setMovies]}>
      {props.children}
    </MovieContext.Provider>
  );
}

export default MovieProvider;

该createContext()函数显示此错误：

预期有 1 个参数，但得到 0.ts(2554) index.d.ts(385, 9)：未提供“defaultValue”的参数。

如果我将其设为字符串，并传递一个字符串作为应用程序构建的值：

export const MovieContext =  createContext('');

<MovieContext.Provider value={''}>
  {props.children}
</MovieContext.Provider>

我应该添加什么样的值作为createContext()参数才能使其与 useState 挂钩一起使用？我正在遵循这个人的教程，他是用 JS …

我有一个运行 Cypress 测试的 Azure DevOps 构建管道。在 Cypress 测试中，我们有一个使用电子邮件和密码登录的测试用户。在我的本地系统上，我的密码保存在一个cypress.env.json文件中。

在 Azure 构建管道上，我收到一条消息，表明密码是undefined有意义的，因为我们将cypress.env.json文件放入 .gitignore 中，以免将其暴露给存储库。

我创建了一个 Azure 变量来表示密码：$(ACCOUNT_PASSWORD)

因此，我认为我需要cypress.env.json在构建管道中创建文件并为其使用 Azure 变量，但我不知道如何在构建步骤中创建文件。

我有这个任务：

- task: CmdLine@2
  displayName: 'run Cypress'
  inputs:
    script: |
      npm run ci

因此，我需要在此之前添加一个任务，cypress.env.json使用代表密码的变量创建文件：

{
  "ACCOUNT_PASSWORD": $(ACCOUNT_PASSWORD)
}

我使用静态网站功能在 Azure 存储上托管 ReactJS 应用程序。使用这个脚本：

$container = "`$web"
$context = New-AzureStorageContext -StorageAccountName $env:prSourceBranchName -StorageAccountKey "e4Nt0********dbFlEG2LN9g2i5/yQ=="
Get-ChildItem -Path $env:System_DefaultWorkingDirectory/_ClientWeb-Build-CI/ShellArtifact/out/build -File -Recurse | Set-AzureStorageBlobContent -Confirm:$false -Force -Container $container -Context $context

我正在将文件从我的构建上传到 Azure 存储 $web blob。

当我导航到静态页面的 URL 时，我会看到一个下载屏幕：

当我删除所有文件并上传 simpel index.html 文件时，我确实加载了 index.html 文件：

https://gist.github.com/chrisvfritz/bc010e6ed25b802da7eb

编辑

在 Edge 中我可以打开页面，但 Chrome 和 Firefox 会加载下载屏幕。但 Firefox 确实显示了更多信息：

所以看起来内容类型有点奇怪。

我正在开发一个将图像放在div中的网站,图像下方是一个<p>带有一些文本的标记.图片可以是150px宽或200px宽,但<p>标签不应该比图像宽,因为它会弄乱布局.所以我不知道该怎么做,图像的宽度是动态的,所以我不能在任何地方放宽度,所以我可能不得不求助于javascript来获取图像的宽度并将宽度放在<p>标签上但javascript并不是我的强项,所以我希望有一个简单的css解决方案.

这里有一些代码,所以你们可以看看它的外观.

<li>
    <div class="container_movie">
        <img src="images/category/movie/super-8-cover.jpg"/>
        <p> super8<br/>
        22-07-’11 <span class="day_countdown">// 11 days</span></p>
    </div>
</li>

我也知道代码还不完美,我还在测试很多.

我正在关注本教程当我尝试在帖子上发表评论时,我TypeError: Cannot read property 'comments' of undefined在控制台中收到错误消息.

mainCtrl,

.controller('mainCtrl', ['$scope', 'posts',
  function($scope, posts){
    $scope.posts = posts.posts;

  $scope.addPost = function(){
    if(!$scope.title || $scope.title === '') { alert("Field can't left blank"); return; }

    $scope.posts.push({
      title: $scope.title,
      upvotes: 0,
      comments: [
        {author: 'Joe', body: 'Cool post!', upvotes: 0},
        {author: 'Bob', body: 'Great idea but everything is wrong!', upvotes: 0}
      ]
    });
  };
  }
])

和postCtrl,

.controller('PostsCtrl', ['$scope', '$stateParams', 'posts',
  function($scope, $stateParams, posts){
    $scope.post = posts.posts[$stateParams.id];

    $scope.addComment = function(){
      if($scope.body === …