
SharePoint Framework (SPFx) v1.9.1 Güncellemesi Neler İçermektedir?
SharePoint Framework 1.9.0 release olmuştu fakat bazı sorunlarından dolayı geri alınmıştı ve beklenen 1.9.1 güncellemesi yayınlandı. Linke tıklayarak detaylı release notlarına erişebilirsiniz.
Neler değişti?
- Library component, genel olarak kullanıma sunuldu. Artık preview değil 🙂
- Webpack 3 ‘ten Webpack 4 ‘e geçiş yapıldı. Daha hızlı build elde edebilmekteyiz.
- Teams SDK Vanity URLs destekleyen 1.4.2 versiyonuna yükseltildi.
- GraphHttpClient kaldırıldı. Onun yerine MSGraphClient sınıfını kullanmanız gerekmektedir.
- SPHttpClientBatch son versiyonu sunuldu. Bu sayede tüm request ‘lerinizi topluca gerçekleştirebilirsiniz.
- Office Fabric v6.189.2 support vermeye başladı.
- TypeScript v3.5.3 versiyonuna support vermeye başladı.
- React support verilen versiyon v16.8 yükseltildi. React Hooks artık kullanabiliyoruz 🙂 React Hooks ile ilgili detaylı bilgi için linke tıklayınız.
React Hooks ile ilgili hemen bir kod örneği paylaşayım 🙂
import * as React from 'react';
import styles from './HelloWorld.module.scss';
import { IHelloWorldProps } from './IHelloWorldProps';
import { escape } from '@microsoft/sp-lodash-subset';
import { useEffect, useState } from 'react';
function Example() {
const [count, setCount] = useState(0);
// Similar to componentDidMount and componentDidUpdate:
useEffect(() => {
// Update the document title using the browser API
document.title = `You clicked ${count} times`;
});
return (
<div>
<p>You clicked {count} times</p>
<button onClick={() => setCount(count + 1)}>
Click me
</button>
</div>
);
}
export default class HelloWorld extends React.Component<IHelloWorldProps, {}> {
public render(): React.ReactElement<IHelloWorldProps> {
return (
<div className={styles.helloWorld}>
<div className={styles.container}>
<div className={styles.row}>
<div className={styles.column}>
<span className={styles.title}>Welcome to SharePoint!</span>
<p className={styles.subTitle}>Customize SharePoint experiences using Web Parts.</p>
<p className={styles.description}>{escape(this.props.description)}</p>
<a href="https://aka.ms/spfx" className={styles.button}>
<span className={styles.label}>Learn more</span>
<Example></Example>
</a>
</div>
</div>
</div>
</div>
);
}
}