小编Pra*_*til的帖子

在社交媒体上共享,URL不会呈现任何元数据

我们在React .net核心中使用客户端渲染中的react构建了一个项目(Web Application).

我们使用react-helmet动态分配元标记.

问题是当应用程序在浏览器中呈现时.浏览器在初始加载时只获取静态HTML,不包括我们设置的动态元标记.但是在检查时,您会在"Elements"下获得这些元标记.

此外,如果我们使用这些URL在任何社交媒体上进行共享,例如WhatsApp或Facebook,则URL不会呈现任何元数据.

试图寻找我们问题的解决方案,我们遇到的最明显的答案是尝试服务器端渲染.我们明白了,但是当我们准备好将应用程序推出时,它不是在这个时刻试用的解决方案.

我们碰上了另一些人"反应快动","反应快照",但反应-SNAP没有运气,它需要升级版本阵营对16+,这是我们没有,但我想不是所有的依赖进行了升级改造,有一个错误说"

水合物不是一种功能

(水合物涉及反应)

使用react-snapshot,我们找不到必要的类型定义,这在react .net core中需要正常运行

请指导下一个可能的步骤(除了付费的那些,如预渲染等)?

主要目标:社交应用程序应在我们粘贴/共享其中的URL时呈现元数据.

social-media meta-tags typescript reactjs visual-studio-2017

10
推荐指数
2
解决办法
2557
查看次数

类型 '{}' 不能分配给类型 'IntrinsicAttributes & IntrinsicClassAttributes<Search> & Readonly<{ children?: ReactNode; }>

我对 React 和 TypeScript 很陌生。我正在 Visual Studio 2017 中开发一个网页,其中有一个我想在我的主页组件中使用的搜索组件。但是在将搜索导入我的主组件后,我收到一个编译时错误,说:

Type {} is not assignable to type 'IntrinsicAttributes & IntrinsicClassAttributes<Search> & Readonly<{ children?: ReactNode; }>  
Type {} is not assignable to type Readonly<SearchForm>  
 Property 'suggestionList' is missing in type {}
Run Code Online (Sandbox Code Playgroud)

搜索组件代码:

export class Search extends React.Component<SearchForm> { //SearchForm is a class with string and an object of another class as properties
constructor() {
    super();
}
Run Code Online (Sandbox Code Playgroud)

主页组件代码:

   export class Home extends React.Component<RouteComponentProps<{}>, {}> 
   {
   return <div>
        < Search /> // <=Getting error …
Run Code Online (Sandbox Code Playgroud)

typescript reactjs

6
推荐指数
1
解决办法
2万
查看次数

未捕获的 DOMException:无法在“历史”上执行“pushState”:函数 () { [本机代码] } 无法克隆

我正在 Visual Studio 2017 提供的 reactjs 模板中创建一个小型 Web 应用程序。我陷入了一种情况,我希望将函数作为状态传递给子组件,然后通过子组件调用该函数。我有一个标题组件,其中有一个名为setLogInTrue()的方法,我想将其传递给我的 SignIn 组件。以下是我的代码:-

头文件.tsx

class HeaderState {
isLoggedIn: boolean;
}

export class Header extends React.Component<HeaderProps, HeaderState> {
constructor() {
    super()
    this.state = ({ isLoggedIn: false });
    this.setLogInTrue= this.setLogInTrue.bind(this);
}

setLogInTrue() {
    this.setState({ isLoggedIn: true });
}

public render(){
//Some elements
<NavLink className="link header_row_link" to={{ pathname: '/signIn', state: this.setLogInTrue }}> //<-- i thought this would work and give the function in the location of SignIn components state but it does not. …
Run Code Online (Sandbox Code Playgroud)

typescript reactjs visual-studio-2017

5
推荐指数
2
解决办法
9356
查看次数