主页 / user-365719

Alexei's questions

Martin Hope
Alexei
Asked: 2022-05-13 05:59:59 +0800 CST
  • 0

再会！

如何布置这些元素：

  1. 文本的第一个字母以不同的颜色突出显示（Active Trust 徽标）
  2. 图片可见的文本（Active Trust 标题出现在“Digital-agency”之后）
  3. 活动信任标头的下划线不完整（例如border-bottom 不起作用）。
  4. 文本折叠成一个圆圈，通过其中一个可见图片的符号（在第二块 Active Trust Digital Agency）
  5. 包含在此按钮之外结束的图像或箭头符号的按钮。

在此处输入图像描述

html
Martin Hope
Alexei
Asked: 2022-05-12 02:12:57 +0800 CST
  • -4

我在上大学，我必须在星期三去那里，我从 11:55 到 15:00-16:00 在那里。可能1-2月或春季会有一些考试，有时我会更频繁地去那里。我想在网络工作室找到一份远程初级前端开发人员的工作。

上大学之前，我在一家网络工作室做前端开发，工作时间是5月2日（周一-周五）10:30到19:00。通常在网络工作室中，前端开发人员有这样的时间表。

我快速、跨浏览器、自适应地创建登录页面。我还在 React 中制作单页应用程序。我知道：html、css、sass、pug、javascript (es6)、npm、gulp、react、figma、一些 php。在这个过程中，我会学习一些其他的技术（typescript、redux等）。

我想完成大学并上大学（加速教育），现在我想并行工作，这样我就有足够的钱生活。我怎么会在这种情况下？怎样才能把学习和工作结合起来？（问题是每周和以后的考试都很忙（他们是忙碌的日子）。我想弄清楚我仍然可以将学习与工作结合起来，但到目前为止我还没有想出）

感谢您的关注。

frontend
Martin Hope
Alexei
Asked: 2022-04-29 03:16:50 +0800 CST
  • 0

再会！

我想在功能性 React 组件中实现条件渲染。我不知道如何在函数中做到这一点。

我需要根据状态渲染相应的导入组件。

我使用三元运算符编写了这个逻辑，一切正常，但是这段代码很糟糕而且不可读。

我绝对需要在功能组件中实现它，因为 我用钩子。

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

import Header from './header/header';
import Footer from './footer/footer';

//Один из этих компонентов будет рендерится между Хэдером и Футером  ↓
//Название компонента в состоянии (activeItem)

import Landing from './landing/landing';
import BookingManagement from './bookingManagement/BookingManagement';
import BookingTickets from './bookingTickets/bookingTickets';
import EnterProfile from './enterProfile/enterProfile';
import PersonalArea from './personalArea/personalArea';
import Register from './register/register';
import SearchResults from './searchResults/searchResults';
import ChoosePlace from './choosePlace/choosePlace';


function App() {
    
    const [activeItem, setActiveItem] = useState('landing');
    
    
     useEffect(() => {
        console.log(activeItem)
      });

  return (
       <>
      
      
          <Header changeMain={setActiveItem}/>
            
      
    
       {(activeItem=='landing' ? (
        <Landing changeMain={setActiveItem}/>
      ) : (
        <></>
      ))}
        {(activeItem=='bookingManagement' ? (
        <BookingManagement />
      ) : (
        <></>
      ))}
          {(activeItem=='bookingTickets' ? (
        <BookingTickets />
      ) : (
        <></>
      ))}
        {(activeItem=='enterProfile' ? (
                <EnterProfile />
              ) : (
                <></>
         ))}
          {(activeItem=='personalArea' ? (
                <PersonalArea />
              ) : (
                <></>
         ))}
           {(activeItem=='register' ? (
                <Register/>
              ) : (
                <></>
         ))}
             {(activeItem=='searchResults' ? (
                <SearchResults/>
              ) : (
                <></>
         ))}

           {(activeItem=='choosePlace' ? (
                <ChoosePlace />
              ) : (
                <></>
         ))}
          
          
          
          
          
          
      
          <Footer changeMain={setActiveItem}/>
       </>
  );
}

export default App;

javascript
Martin Hope
Alexei
Asked: 2022-04-09 23:20:32 +0800 CST
  • 0

再会！

我的 js 文件中有以下几行。我只需要从这些行中获取图片的名称和扩展名。也就是说，我需要第一个斜线之前右边的文本。我怎么才能得到它？

以下是这些行：

assets/img/header/item.png
assets/img/header/item2.png
assets/img/why/lightning_bg_4x.png
assets/img/why/target_1.png
assets/img/case/case-2.png
assets/img/case/case-1.png

感谢您的关注

javascript
Martin Hope
Alexei
Asked: 2022-04-07 15:00:33 +0800 CST
  • 0

再会！

我想知道登陆页面在 Iphone 11、Iphone 12、小米 Mi A1 和其他设备上的外观。我需要的设备不在 Toogle 设备工具栏中 (Ctrl + Shift + m) -> 编辑 -> Chrome DevTools 中的设备。如何找出在 Toogle Device Toolbar -> Responsive 中设置的宽度和高度，以便在我需要的设备上获得图片？

感谢您的关注..

html
Martin Hope
Alexei
Asked: 2022-04-05 16:16:11 +0800 CST
  • 0

我需要将我的 svg 文件转换为 clip-path css 属性。有一颗多角星。

在此处输入图像描述

此图像的 SVG 代码：

<svg xmlns="http://www.w3.org/2000/svg" width="143" height="146" viewBox="0 0 143 146" fill="none">
<path d="M61.0611 10.0793C62.2089 7.80603 65.2969 7.42567 66.962 9.35247L74.8594 18.4911C76.0985 19.925 78.2408 20.1439 79.7443 18.9903L89.327 11.6381C91.3475 10.088 94.2947 11.0851 94.9589 13.5436L98.1091 25.2037C98.6034 27.0332 100.439 28.16 102.294 27.773L114.117 25.3067C116.61 24.7867 118.833 26.9638 118.365 29.467L116.144 41.3393C115.795 43.2021 116.96 45.0135 118.799 45.4697L130.522 48.3778C132.994 48.9909 134.052 51.9169 132.544 53.969L125.392 63.7019C124.27 65.229 124.533 67.3663 125.992 68.5755L135.292 76.2819C137.253 77.9067 136.937 81.002 134.688 82.1966L124.021 87.8624C122.347 88.7514 121.657 90.7912 122.447 92.5138L127.483 103.492C128.544 105.807 126.917 108.458 124.372 108.559L112.303 109.036C110.409 109.11 108.903 110.649 108.867 112.543L108.641 124.62C108.593 127.166 105.976 128.848 103.639 127.835L92.559 123.028C90.8204 122.273 88.7953 123.006 87.9412 124.697L82.4975 135.479C81.3497 137.753 78.2617 138.133 76.5966 136.206L68.6992 127.067C67.4601 125.634 65.3178 125.415 63.8142 126.568L54.2315 133.92C52.2111 135.471 49.2639 134.473 48.5997 132.015L45.4495 120.355C44.9552 118.525 43.1201 117.399 41.2649 117.786L29.4412 120.252C26.9482 120.772 24.7255 118.595 25.1938 116.092L27.4147 104.219C27.7632 102.356 26.5986 100.545 24.7593 100.089L13.0364 97.1808C10.5647 96.5677 9.5067 93.6417 11.0147 91.5896L18.1669 81.8567C19.2891 80.3295 19.0258 78.1923 17.5666 76.9831L8.26632 69.2767C6.30543 67.6518 6.62176 64.5566 8.87078 63.362L19.5376 57.6962C21.2113 56.8072 21.9014 54.7673 21.1113 53.0448L16.0758 42.0663C15.0141 39.7516 16.6421 37.1001 19.1867 36.9996L31.2555 36.523C33.1491 36.4483 34.656 34.9099 34.6915 33.0151L34.918 20.939C34.9658 18.3929 37.583 16.7103 39.9192 17.7239L50.9996 22.5309C52.7382 23.2852 54.7633 22.5529 55.6174 20.8612L61.0611 10.0793Z" fill="#7A50FF"/>
</svg>

html
Martin Hope
Alexei
Asked: 2022-03-22 20:42:10 +0800 CST
  • 0

gridTemplateAreasArray我有一个由一个元素组成的初始数组。
该元素具有以下值：

'"sources auto" "clicks auto" "shows auto" "conversion-price auto" "price auto" "conversion auto" "sales auto"'

我需要通过 JS 重写这个数组，使它看起来像这样：

[
  '"sources auto" "clicks auto" "shows auto" "conversion-price auto" "price auto" "conversion auto" "sales auto"',
  '"sources_twin_1 auto" "clicks_twin_1 auto" "shows_twin_1 auto" "conversion-price_twin_1 auto" "price_twin_1 auto" "conversion_twin_1 auto" "sales_twin_1 auto"'
]

可用代码

const table = document.querySelector('.table'),
        tableArticles = document.querySelectorAll('.table__article');
  
const gridTemplateAreas = window.getComputedStyle(table).gridTemplateAreas;
const gridTemplateAreasArray = window.getComputedStyle(table).gridTemplateAreas.split();

我该怎么做？

javascript
Martin Hope
Alexei
Asked: 2022-03-22 16:52:14 +0800 CST
  • 0

我有一个用 JS 编写的汉堡菜单类。它有不同的设置。我想在我的 React 应用程序中使用它。我希望菜单按钮（它是一个单独的组件）在按下菜单按钮时离开屏幕，并在再次按下时返回。我在 JS 类中编写了这个功能。现在如何在 React 类中使用这个 JS 代码？我不想在一些 React 类方法中放入大量代码。是否有可能以某种方式将我的 Burger 菜单类导入 React 类并将它们一起使用？

这是我写的汉堡菜单类： https ://github.com/konstantinstepanyan/Menu-Toggler

如何将它放入 React 组件中，以使 React 类代码保持可读性和美观性？

感谢您的关注。

javascript
Martin Hope
Alexei
Asked: 2022-03-12 09:02:15 +0800 CST
  • 0

我需要通过JS和transition属性设置css属性。我想通过 JS 添加供应商前缀。该脚本不适用于 cssText，没有它们，只会添加一个没有前缀的过渡。如何通过 JS 添加前缀转换？

document.addEventListener('DOMContentLoaded', () => {
    
    class MenuToggler{
        constructor(data){
            this.menuTriggerSelector = data.menuTriggerSelector;
            this.menuSelector = data.menuSelector;
            this.type = data.type || 'appear'; //type of Apperance
            
            this.menuTrigger = document.querySelector(`${this.menuTriggerSelector}`);
            this.menu = document.querySelector(`${this.menuSelector}`);
            
            this.transitionTime = data.transitionTime || '.25s';            
            this.init();
        }
        
        init(){
            if (this.type == 'appear'){
                // add first styles, makes elem invisible and untouchuble
                
                this.menu.style.height = '0px';
                this.menu.style.opacity = '0';
                this.menu.style.transition = `opacity ${this.transitionTime} linear ${this.transitionTime}, height 0s linear 0s`;
                this.menu.style.cssText = `-webkit-transition: opacity ${this.transitionTime} linear ${this.transitionTime}, height 0s linear 0s`;
                this.menu.style.cssText = `-o-transition: opacity ${this.transitionTime} linear ${this.transitionTime}, height 0s linear 0s`;
            }
        }
    }
    
    const menuToggler1 = new MenuToggler({
        menuTriggerSelector: '.burger',
        menuSelector: '.links-wrapper'
    });
    
});

javascript
Martin Hope
Alexei
Asked: 2022-02-16 08:33:26 +0800 CST
  • 0

谷歌浏览器加载笔记本电脑处理器低于 100%。我最近搬到了 SSD 上，Chrome 也加载了 CPU。在此之前，它还加载在 HDD 上。我使用 Chrome 搜索恶意软件，并在任务管理器和 Chrome 的任务管理器中四处寻找。我应该怎么办？笔记本电脑 Asus X540NA CPU Intel Celeron N3450 RAM 4GB Windows 10 Enterprise 64gb

google-chrome
Martin Hope
Alexei
Asked: 2022-02-13 03:41:43 +0800 CST
  • 1

我使用 img 标签将图像插入到布局中。图像文件本身是高分辨率的。我需要图片

height: 48px;
width: 88px;

我在 CSS 中指定了这些样式。但是图片被压缩并且看起来很糟糕，并且对于其他图片，我指定的高度和/或宽度小于原始文件的高度和/或宽度，分辨率下降并且它们看起来“肥皂”。我应该怎么做才能使图片在不同分辨率下看起来不像肥皂？

在我的布局中，图像如下所示： [![在此处输入图像描述][1]][1] [1]: https://isstatic.askoverflow.dev/V71mI.png

虽然文件本身的分辨率为 300 * 185，即 比我需要的多。如果您没有在 CSS 中为 img 标签指定宽度和/或高度，则图像会查看其分辨率并在布局中占用比应有的空间更多的空间。

html
Martin Hope
Alexei
Asked: 2022-01-04 08:44:04 +0800 CST
  • 2

我想购买一台具有未来潜力的工作显示器（前端开发人员）。预算高达 17000。我面临着 AOC G2590FX 24.5 英寸 144Hz 显示器（用于游戏，仅通过 DisplayPort）、TN-matrix (-) 或飞利浦 245E1S 23.8 英寸 75Hz 显示器（- 用于游戏）、IPS (+) 之间的选择, 四倍高清。如有必要，我可以以某种方式将图像从 QuadHD 转换为 FullHD（嗯，即双倍像素）？如果我拿一台分辨率为 4K 的显示器，我可以将 4K 分辨率转换为 FullHD 吗？我的工作可能需要这个，用像素完美地从模板组成网站。如果这是不可能的，那么建议使用高达 17,000（越便宜越好）游戏（从 144Hz 开始）或具有高 ppi 的合适显示器。我将通过 HDMI 连接。还希望有一个 DisplayPort。感谢您的关注。

монитор
Martin Hope
Alexei
Asked: 2021-11-29 05:03:06 +0800 CST
  • 0

我需要一个元素来顺利出现。他的原始风格：

transition: 'all 1s linear';
display: 'none';
opacity: 0;

单击时，它应该出现并变为：

display: 'block';
opacity: 1;

在我的代码中，它突然出现并且根本不顺利：

this.trigger.addEventListener('click', ()=>{
           this.popupWindow.style.display = 'block';   
           this.popupWindow.style.opacity = 1;        
 });

我找到了一个解决方案，并在 setTimeout 中以 1/1000 秒的时间隐藏了透明度（它确实看起来很流畅，如转换 css 属性中所写）：

this.trigger.addEventListener('click', ()=>{
           this.popupWindow.style.display = 'block';   
           setTimeout(()=>{this.popupWindow.style.opacity = 1}, 1); 
});

虽然我的解决方案有效，但我不喜欢它在美学上，我想找到一个更正确、更优雅、更简洁的解决方案来解决这个问题。感谢您的关注。

javascript
Martin Hope
Alexei
Asked: 2020-08-23 21:11:08 +0800 CST
  • 0

我需要将字符串写入 notes.json 文件。我的 php 脚本由于某种原因无法正常工作。没有错误，只是该行没有添加到文件中。

应用程序：

import React, {
    Component
} from "react";
import Notes from "./Notes.js";
import $ from "jquery";
 
import {
    withoutIndex
} from "./utils.js"


class App extends Component {
    constructor(props) {
        super(props);
        this.state = {
            notes: []
        };
    }
    componentDidMount(){
        this.getNotes();
    }

    
    async getNotes(){
        let notesList = [];
        await $.getJSON('./api/notes.json', function(data) {
            for(let i = 0; i<data.length; i++){
                notesList.push(data[i].text);
            }
           
        });
        await this.setState({
            notes: notesList
        });
    }

    async onNoteCreate(newNodeText){
        this.setState(oldState => {
             return {
                notes: [newNodeText].concat(oldState.notes)
            };
          });
        $.ajax({
            url: './api/saveNote.php',
            method: 'GET',
            async: false,
            data: {
                text: newNodeText
            }
        });
    }

    render() {
        return <Notes
        notes={this.state.notes}
        onDelete={this.onNoteDelete.bind(this)}
        onCreate={this.onNoteCreate.bind(this)}
        />;
    }
}


export default App;

保存笔记.php：

<?php

$text = $_POST["text"];
$notes = json_decode(file_get_contents("./api/notes.json"));

array_push($notes, ["text" => $text]);
file_put_contents("./api/notes.json", json_encode( $notes ));

notes.json 文件如下所示：

[{"text":"lorem ipsum dolor sit amet"}, 
{"text": "aezakmi"}]

单击按钮时，我需要将带有输入字段值的“文本”键添加到 notes.json 文件中。

javascript