web-dev-qa-db-fra.com

La propriété 'share' n'existe pas sur le type 'Navigator'

Je dois utiliser WebShareAPI dans mon application Ionic.

Voici le code suggéré dans Introduction à l'API de partage Web

if (window.navigator && window.navigator.share) {
  window.navigator.share({
    title: 'title',
    text: 'description',
    url: 'https://soch.in//',
  })
    .then(() => console.log('Successful share'))
    .catch((error) => console.log('Error sharing', error));
} else {
  alert('share not supported');
}

Cependant, la compilation TypeScript échoue avec l'erreur suivante:

[11:31:11]  TypeScript: src/pages/channel_home/channel_home.ts, line: 89
            Property 'share' does not exist on type 'Navigator'.

Il y a une raison probable expliquée ici DOM lib: ajouter le support pour navigator.share

Toutefois, j'aimerais connaître une solution de contournement pour que WebShareApi fonctionne dans mon application Ionic en particulier, et dans toute application Angular ou TypeScript en général.

7
pradeep

En fonction de ce answer , vous pouvez essayer de définir une variable de type any et de lui attribuer la valeur de Type Navigator. Isssue est lié aux typages TypeScript.

let newVariable: any;

newVariable = window.navigator;

if (newVariable && newVariable.share) {
  newVariable.share({
    title: 'title',
    text: 'description',
    url: 'https://soch.in//',
  })
    .then(() => console.log('Successful share'))
    .catch((error) => console.log('Error sharing', error));
} else {
  alert('share not supported');
}

Une autre option serait d'étendre l'interface Navigator comme suggéré dans le lien que j'ai posté ci-dessus.

11
edkeveked

Cela fonctionne aussi et nous n'avons pas besoin de créer une nouvelle variable.

if (window.navigator && window.navigator.share) {
  window.navigator['share']({
    title: 'title',
    text: 'description',
    url: 'https://soch.in//',
  })
    .then(() => console.log('Successful share'))
    .catch((error) => console.log('Error sharing', error));
} else {
  alert('share not supported');
}
3
Avinash

Cela a fonctionné pour moi

let newVariable = (window.navigator as any)
if(newVariable.share){
  newVariable.share({
  title: 'title',
  text: 'description',
  url: 'https://soch.in//',
})
  .then(() => console.log('Successful share'))
  .catch((error) => console.log('Error sharing', error));
} else {
  alert('share not supported');
}   
0
Genio Rosario