到目前为止，我正在使用Laravel Nova，真的很喜欢。
我有一个<NavigationItems />字段，我已经成功收集了地址，城市，州等。
我还想保存由Algolia API返回的地理位置数据。
具体地说，我要存储：
import React from 'react';
import NavigationItems from './NavigationItems';
import { uniqID } from '../../../common/Functions';
import { Row } from '../../../css/Grid.css';
const NavigationBar = props => {
const settings = props.settings;
return (
<nav>
<ul>
<Row>
{settings.items.map((contents, index) =>
<NavigationItems settings={{...contents}} isDropdown={contents.items ? true : false} key={uniqID()} />
)}
</Row>
</ul>
</nav>
);
};
export default NavigationBar
这是观察员参与其中的地方吗？我已经尝试过了，但是我只是从模型中获取数据。不是Algolia返回的数据。
我想说：“嘿，像往常一样保存地址，城市和州，还要将_geoloc保存到我的<NavigationItems />和import React from 'react';
import { uniqID } from '../../../common/Functions';
import { NavLi, NavItem, Dropdown } from '../../../css/Navigation.css';
import { Icon } from '../../../css/Common.css';
import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
class NavigationItems extends React.Component {
constructor(props) {
super(props);
this.state = {
dropdownOpened: false,
navLiWidth: null,
navLiHeight: null
}
}
handleClick = e => {
e.preventDefault();
this.setState(prevState => ({
dropdownOpened: !prevState.dropdownOpened
}));
};
handleClickOutside = e => {
const target = e.target;
if (!this.NavLi.contains(target)) {
this.setState({
dropdownOpened: false
})
}
}
componentDidMount = () => {
const navLiWidth = this.NavLi.clientWidth,
navLiHeight = this.NavLi.clientHeight;
this.setState({
navLiWidth: navLiWidth,
navLiHeight: navLiHeight
});
document.addEventListener('click', this.handleClickOutside, false);
}
componentWillUnmount = () => {
document.removeEventListener('click', this.handleClickOutside, false);
}
render = () => {
const settings = this.props.settings,
isDropdown = this.props.isDropdown
return (
<NavLi isDropdown={isDropdown} innerRef={x => this.NavLi = x}>
<NavItem href={settings.link || '#'} onClick={isDropdown ? this.handleClick : null}>
{settings.icons && settings.icons.filter(contents => contents.iconPos === 'beforeText').map(contents =>
<Icon beforeText key={uniqID()}><FontAwesomeIcon icon={contents.title} fixedWidth /></Icon>
)}
{settings.title}
{settings.icons && settings.icons.filter(contents => contents.iconPos === 'afterText').map(contents =>
<Icon afterText key={uniqID()}><FontAwesomeIcon icon={contents.title} fixedWidth /></Icon>
)}
</NavItem>
{isDropdown &&
<Dropdown hierarchy={settings.dropdownHierarchy} opened={this.state.dropdownOpened} topPos={this.state.navLiHeight} leftPos={this.state.navLiWidth} desPos={10} startPos={50}>
{settings.items.map(contents =>
<NavigationItems settings={{...contents}} isDropdown={contents.items ? true : false} key={uniqID()} />
)}
</Dropdown>
}
</NavLi>
);
};
};
export default NavigationItems
字段中。”
我想这可能适用于发生某种自动完成的任何Place。
有办法吗？