Compartilhar via

Notas sobre a versão da Estrutura do SharePoint v1.14

  • Artigo

Esta versão apresenta atualizações entre os recursos em torno de Microsoft Viva, Microsoft Teams e SharePoint.

Lançamento: 17 de fevereiro de 2022

Importante

Esta página aborda detalhes relacionados a uma versão SPFx específica. Esta página não inclui pré-requisitos SPFx adicionais que devem ser instalados para desenvolver soluções SPFx, incluindo Node.js, Yeoman e outras ferramentas.

Para saber mais sobre esses pré-requisitos, consulte Configurar seu ambiente de desenvolvimento da Estrutura do SharePoint.

Atualização de projetos da v1.13.1 para v1.14

  1. No arquivo package.json do projeto, identifique todos os pacotes SPFx v1.13.1. Para cada pacote SPFx:

    1. Desinstale o pacote v1.13.1 existente:

      npm uninstall @microsoft/{spfx-package-name}@1.13.1

    2. Instale o novo pacote v1.14:

      npm install @microsoft/{spfx-package-name}@1.14.0 --save --save-exact

Dica

A CLI do Microsoft 365 fornece uma orientação passo a passo fácil para atualizar suas soluções para a versão mais recente da Estrutura do SharePoint.

Novas características e recursos

Atualizações de extensão de cartão adaptável para Viva Connections

Atualizou o scaffolding ace para Viva Connections

Atualizado o scaffolding da Extensão de Cartão Adaptável para ser mais sucinto.

Obter ViewNavigator Atual para Extensão de Cartão Adaptável

BaseAdaptiveCardExtension.navigator

Se o valor atual renderType for Card retornará BaseAdaptiveCardExtension.cardNavigator. Se o valor atual renderType for QuickView retornará BaseAdaptiveCardExtension.quickViewNavigator.

Listar Atualizações do Conjunto de Comandos de Exibição

Informar ListView sobre alterações no conjunto de comandos

BaseListViewCommandSet.raiseOnChange: () => void

Use esse método para disparar onChange evento e inicializar um refluxo de ListView.

Estado do Acessador do Modo de Exibição de Lista Expandido

ListViewAccessor fornece o estado expandido da exibição de lista atual. As Novas propriedades de estado estão listadas abaixo.

  • rows - linhas renderizadas atualmente na exibição de lista.
  • selectedRows - linhas selecionadas na exibição de lista.
  • list - informações básicas sobre a lista renderizada pela exibição de lista.
  • view - informações básicas sobre a exibição renderizada pela exibição de lista.
  • folderInfo - informações da pasta para a exibição de lista.
  • appliedFilters - filtros aplicados à exibição de lista.
  • sortField - nome do campo de classificação.
  • sortAscending - especifica se a exibição de lista é classificada em ordem crescente ou decrescente.

Evento de Alteração do Estado de Exibição de Lista

ListViewAccessor.listViewStateChangedEvent: SPEvent<ListViewStateChangedEventArgs>

Esse evento é gerado sempre que o estado da exibição de lista é alterado. Os argumentos contêm o tipo de evento ocorrido (confira ListViewAccessorStateChanges) e o estado anterior da exibição de lista (confira IListViewAccessorState).

A Propriedade de Comando do Conjunto de Comandos de Lista está Desabilitada

Command.disabled: boolean | undefined;

Atualizações específicas da Web Part

Grupo de Seletor de Web Part Predefinido para Web Parts em Desenvolvimento

PredefinedGroup.Local = '8b7bf6f1-a56a-4aa3-8657-7eb6e7e6af61';

O grupo exibe Web Parts depuradas localmente.

Retorno de Chamada para Limpar o Elemento DOM Antes de Carregar o Indicador ou Exibir o Elemento de Erro

IClientSideWebPartStatusRenderer.displayLoadingIndicator(domElement: Element, loadingMessage: string, timeout?: number, clearDomElementCallback?: ClearDomElementCallback): void;
IClientSideWebPartStatusRenderer.renderError(domElement: HTMLElement, error: Error | string, clearDomElementCallback?: ClearDomElementCallback);

Use clearDomElementCallback para limpar o nó DOM.

Método de ciclo de vida da Web Part para alterações de tema

BaseClientSideWebPart.onThemeChanged(theme: IReadonlyTheme | undefined): void;

Quando um tema é inicializado ou alterado em uma página, onThemeChanged será invocado com o novo tema.

Importante

render não deve ser invocado em onThemeChanged. A chamada render pode levar a um re-fluxo não previsto da Web Part. render será automaticamente invocado, se necessário.

Modelos de Web Part atualizados

  • Nenhum modelo do Framework e do React são atualizados com a nova interface do usuário amigável
  • Novo modelo "Mínimo" é adicionado: permite iniciar o desenvolvimento com a quantidade mínima de código provisionado.

Outras atualizações e alterações genéricas

Alterações em Opções e Prompts de Scaffolding

Os próximos prompts foram preteridos para os seguintes padrões:

  • Descrição da solução
  • Versão do ambiente (Microsoft Office SharePoint Online)
  • Implantação em todo o locatário
  • Permissões isoladas
  • Descrição do componente

Detectar se um componente está carregando do localhost

BaseComponentContext.isServedFromLocalhost(): boolean;

Qualquer componente SPFx agora pode verificar se ele está sendo executado no momento a partir do código servido localmente.

Ocultar um nome de grupo do Painel de Propriedades

IPropertyPaneGroup.isGroupNameHidden?: boolean;

isGroupNameHidden pode ser usado para ignorar a renderização do nome do grupo do Painel de Propriedades para evitar que um cabeçalho de grupo vazio seja exibido.

O valor padrão de isGroupNameHidden é falso.

Propriedade ipAddress em serve.json

A nova propriedade ipAddress foi adicionada à serve.json configuração. Esse parâmetro é útil ao usar contêineres do Docker. Por exemplo, para definir o host de serviço como '0.0.0.0'. Essa propriedade será usada explicitamente para encerrar o servidor, o que significa que todas as URLs de depuração e configurações de webpack não serão afetadas.

Recursos e Capacidades de Visualização

Os recursos a seguir ainda estão em status pré-visualização como parte da versão 1.14 e não devem ser usados em produção. Queremos lançá-los oficialmente como parte da próxima versão 1.15.

Cache de exibição de cartão Extensões de Cartão Adaptável

Para melhorar o desempenho, o SPFx agora suporta o armazenamento em cache local das exibições de cartão da Extensão de Cartão Adaptável. A exibição do cartão armazenado em cache será renderizada imediatamente ao carregar sua Extensão de Cartão Adaptável. Após o carregamento da Extensão de Cartão Adaptável, ela pode atualizar opcionalmente a exibição do cartão.

interface ICacheSettings {
  /**
   * Whether cache is enabled. Default: true
   */
  isEnabled: boolean;
  /**
   * Expiry time in seconds. Default: 86400 seconds (24 hours)
   */
  expiryTimeInSeconds: number;

  /**
   * Returns the Card View used to generate the cached card.
   * By default, the currently rendered Card View will be used to cache the card.
   */
  cachedCardView?: () => BaseCardView;
}
BaseAdaptiveCardExtension.getCacheSettings(): Partial<ICacheSettings>;

Por padrão, o cache é habilitado com configurações padrão. Uma Extensão de Cartão Adaptável pode personalizar suas configurações de cache substituindo getCacheSettings para retornar as configurações que deseja substituir.

Quando a última exibição de cartão conhecida não deve ser armazenada em cache, você pode fornecer uma exibição de cartão específica para ser armazenada em cache e exibida na próxima página de carregamento através de ICacheSettings.cachedCardView. Essa exibição de cartão não precisa ser registrada previamente.

Uma Extensão de Cartão Adaptável também pode armazenar em cache localmente seu estado atual. Por padrão, nenhum estado é armazenado em cache.

BaseAdaptiveCardExtension.getCachedState(state: TState): Partial<TState>;

Se getCachedState for substituído, os valores armazenados em cache serão fornecidos quando a Extensão de Cartão Adaptável for inicializada na próxima carga de página.

onInit tem uma nova sobrecarga, que passa informações sobre o estado do cartão em cache. Se o cartão não foi carregado de uma exibição de cartão em cache, então cachedLoadParameters será undefined.

interface ICachedLoadParameters {
    state: TState;
}
BaseAdaptiveCardExtension.onInit(cachedLoadParameters?: ICachedLoadParameters): Promise<void>;

O estado inicial da Extensão de Cartão Adaptável pode ser propagado a partir do estado em cache. O estado em cache também pode ser usado para determinar se qualquer lógica adicional precisa ser executada.

O cache de estado e o tempo de expiração do cache podem ser usados para determinar quando chamadas remotas caras precisam ser feitas pela Extensão de Cartão Adaptável.

O cache pode ajudar a melhorar significativamente o desempenho percebido para sua Extensão de Cartão Adaptável.

Método do Manipulador de Erros. Esse método será invocado quando uma Ação gerar um erro

BaseView.onActionError(error: IActionErrorArguments): void

Substitua este método para tratar erros de ações de Cartão Adaptável.

Novos tipos de Ação para mídia e geolocalização

Observação

Essas novas ações estão disponíveis apenas no navegador no momento. Viva Connections desktop e Viva Connections suporte móvel serão habilitados posteriormente.

Depois da Disponibilidade Geral, a matriz de suporte para ações terá a seguinte aparência:

Action Área de Trabalho de Conexão do Viva Viva Connections Mobile Navegador
Selecionar Mídia Com suporte Com suporte Com suporte
Obter Localização Não suportado Com suporte Com suporte
Mostrar Local Não suportado Com suporte Com suporte 

ISPFxAdaptiveCard.actions?: (
    | ISubmitAction
    | IOpenUrlAction
    | IShowCardAction
    | ISelectMediaAction // Raise a file picker or native media picker
    | IGetLocationAction // Get a location
    | IShowLocationAction // Show a location on a map
)[];

A ação SelectMedia e Location pode ser configurada conforme mostrado abaixo:

  actions: [
    {
      type: 'VivaAction.SelectMedia',
      id: 'Select File',
      parameters: {mediaType: MediaType.Image, allowMultipleCapture: true, maxSizePerFile : 200000, supportedFileFormats: ['jpg']},
      title: 'Select File'
    },
    {
      type: 'VivaAction.GetLocation',
      id: 'Get Location',
      parameters: {chooseLocationOnMap: true}
    }
    {
      type: 'VivaAction.ShowLocation',
      id: 'Show Location',
      parameters: parameters: {locationCoordinates: {latitude: 40, longitude: 40}}
    }
  ]

As ações serão renderizadas como abaixo

Ação de Localização:

Captura de tela da ação de localização

Ação Selecionar Media:

Captura de tela da ação do arquivo

A Ação de Localização pode ser usada para obter sua localização atual, mostrar sua localização atual ou personalizada em um mapa e escolher sua localização atual em um mapa. No navegador, ela usa o Bing Mapas como interface de mapeamento:

Captura de tela do painel de localização

A Ação Selecionar Mídia pode ser usada para selecionar imagens do seu dispositivo nativo. No navegador, ela usa o seletor de arquivos para ajudar a acessar os arquivos relevantes:

Captura de tela do painel de mídia

API auxiliar de imagem

A classe estática ImageHelper (em @microsoft/sp-image-helper) foi adicionada para permitir acesso ao runtime de desenvolvedores do SPFx a:

  • URLs de imagens em miniatura geradas automaticamente de páginas e documentos armazenados no Microsoft Office SharePoint Online
  • URLs mais otimizadas para imagens armazenadas no Microsoft Office SharePoint Online

Saiba mais: API auxiliar de imagem

Substituição e itens removidos nesta versão

Importante

Qualquer solução existente que esteja usando APIs removidas continuará funcionando sem problemas. A remoção significa que você não pode criar novas soluções que estejam usando estas APIs.

  • APIs preteridas de @microsoft/sp-listview-extensibility:
    • BaseListViewCommandSet.onListViewUpdated
  • APIs preteridas de @microsoft/sp-core-library
    • EnvironmentType.Local
  • APIs preteridas removidas de @microsoft/sp-http
    • GraphHttpClient
    • GraphHttpClientConfiguration
    • GraphHttpClientResponse
    • IGraphHttpClientConfiguration
    • IGraphHttpClientConfigurations
    • IGraphHttpClientOptions
  • APIs de visualização removidas de @microsoft/sp-webpart-base
    • ISDKs.office
    • IOffice

Problemas Corrigidos

Período de tempo de novembro a fevereiro

  • nº 5131 - Tokens de tema em arquivos SCSS no SPFx 1.10.0 não funcionam mais
  • nº 4808 - SPFX e react-dnd
  • nº 4587 - As seções em segundo plano terão suporte em web parts isoladas do domínio (recurso disponível para spfx 1.8.2 em postes)
  • nº 4550 - Página de aplicativo de parte única não impede a navegação quando há alterações não salvas
  • nº 5098 - this.context.propertyPane.open() abre dentro do iframe em webparts isoladas
  • nº 5227 - Falha na navegação quickLaunch (para SinglePageWebParts)
  • nº 6779 - Os personalizadores de aplicativo aparecem na guia de equipe "Listas" depois de adicionar o item à lista
  • nº 5787 - Verificar a Permissão de Máscara Completa e o Limite de Bitwise JS
  • nº 872 - SPFx: não é possível exibir erros de instalação
  • nº 6253 - pageContext não é atualizado nos personalizadores de aplicativos na navegação embutida
  • nº 6102 - A seção web part de reação completa não renderiza ícones
  • nº 7536 - Link profundo do ACE Teams não navegando para a guia Específica
  • nº 6343 - A visualização não é exibida para a Web Part em um modo de página única
  • nº 7079 - Guid.tryParse() não está funcionando
  • #7558 – Projeto SPFx v1.13.1 padrão recomenda extensão VSCode preterida desnecessária &
  • nº 6854 - Chamar clearLoadingIndicator remove WebPart inteira
  • nº 3219 - Adicionar o Personalizador de Aplicativos ao Projeto de Web Part existente faz com que as Web Parts não sejam implantadas
  • nº 3830 - "A parte especificada não existe no pacote" ao provisionar o docx no elementFiles
  • nº 3840 - Algo deu errado ao implantar ativos do spfx
  • nº 4294 - isGroupNameHidden excluído deste tipo de versão
  • nº 4680 - SPFx 1.9.1, office-ui-fabric-react e sp-property-pane
  • nº 6232 - Obter erros sobre o <div> não pode ser aninhado no <p> ao examinar dados da Web Part no ambiente de teste do workbench
  • nº 7386 - A compilação falha ao definir skipFeatureDeployment como true
  • #7691 - 1.13.1 TypeError: Não é possível ler a propriedade 'toJSON' de undefined ao empacotar/servir um grande projeto