我在 有一个 JavaScript 文件http://localhost:8000/static/home/js/edit_sites.js,它试图访问localhost:8000/static/global/js/modules/reorder.mjs.
edit_sites.js
import { reorder } from '/static/global/js/modules/reorder.mjs';
$(() => {
reorder($('.screenshot-list'));
});
Run Code Online (Sandbox Code Playgroud)
重新排序.mjs
export const reorder = ($ul) => {
// reorder screenshots by clicking arrows
const $up = $ul.find('.controls :first-child');
const $down = $ul.find('.controls :last-child');
const paddingBottom = 8;
$up.on('click', function () {
const $li = $(this).parents('li');
if (!$li.is(':first-child')) {
const $prev = $li.prev();
$li.animate(
{ bottom: `${$prev.outerHeight() + paddingBottom}px` },
500,
function () {
$(this).after($prev.detach()).prop('style', '');
},
);
$prev.animate(
{ …Run Code Online (Sandbox Code Playgroud) 我正在尝试实现一个面包屑式导航栏,如下图所示(取自Namecheap的结帐页面)。为简单起见,假装购物车图标为蓝色圆圈。
通过检查站点的代码,我了解到他们利用::before选择器将水平线和圆形槽口与标签一起放置。我可以将线固定到位,但不能固定圆。
这是我到目前为止的内容:
body {
padding: 1rem;
color: #6d6e70;
font-family: Arial, Helvetica, sans-serif;
font-weight: bold;
}
div.step-nav-container {
position: relative;
}
ol.step-nav {
display: inline-block;
width: 100%;
margin: 2.5rem 0 0 0;
padding: 0;
list-style: none;
}
ol.step-nav::before {
content: '';
border-top: 3px solid #6d6e70;
margin-top: -1px;
position: absolute;
top: 1rem;
right: 0;
left: 0;
z-index: -1;
}
ol.step-nav.step-nav-4::before {
margin: 0 12.5%;
}
ol.step-nav.step-nav-5::before {
margin: 0 10%;
}
ol.step-nav li {
text-align: center;
display: relative;
float: …Run Code Online (Sandbox Code Playgroud)我正在编写一项服务,我打算存储Place对象的本地副本,并仅当它们未存储在本地时才从后端获取它们。但是,我在实现此功能时遇到了困难。fetchPlace()如果来自的值place()未定义,我可以设置我的页面来调用,但我打算保持fetchPlace()私有,以便稍后我可以实现一个系统来检查最近是否发出了请求,以便如果用户快速切换页面。
地点.service.ts
export class PlacesService {
private _places = new BehaviorSubject<Place[]>([]);
get places() {
return this._places.asObservable();
}
constructor(private _http: HttpClient) {}
place(placeId: number): Observable<Place> {
return this._places.pipe(
take(1),
map((places: Place[]) => {
console.log(places);
let place = places.find((place: Place) => place.id === placeId);
if (place === undefined) {
console.log('Time to send a request!');
this.fetchPlace(placeId).subscribe(
(fetchedPlace: Place) => {
console.log('We got one!');
place = fetchedPlace;
console.log(place);
},
(error) => {
console.error('Looks like …Run Code Online (Sandbox Code Playgroud) 我注意到该--description选项是 Fish shell 语法中函数声明的一部分。
例如,/usr/share/fish/functions/abbr.fish:
function abbr --description "Manage abbreviations"\n \xe2\x80\xa6\nend\nRun Code Online (Sandbox Code Playgroud)\n不过,我从未见过它被使用过。以下命令都无法完成我想要完成的任务,即查看任何给定函数的描述(前提是已定义):
\n> abbr --description\nabbr: Unknown option \xe2\x80\x9c--description\xe2\x80\x9d\n/usr/share/fish/functions/abbr.fish (line 6): \n argparse -n abbr $options -- $argv\n ^\nin function 'abbr' with arguments '--description'\n> help --description\nhelp: Unknown option \xe2\x80\x9c--description\xe2\x80\x9d\n/usr/share/fish/functions/help.fish (line 3): \n argparse -n help --max-args=1 $options -- $argv\n ^\nin function 'help' with arguments '--description'\n> help description # opens file:///usr/share/doc/fish/index.html in a browser (same functionality as `help`)\n> help abbr # opens file:///usr/share/doc/fish/cmds/abbr.html in …Run Code Online (Sandbox Code Playgroud)