<n-image :src="serverAddress + modalForm.picture" fit="cover" style="width: 150px; height: 150px;" /> 写一个typescript 更改src的值
时间: 2023-12-05 13:59:26 浏览: 183
Assuming that `serverAddress` and `modalForm.picture` are both strings, here is an example TypeScript code that updates the `src` value of the `n-image` component:
```
import { Component, Vue } from 'vue';
@Component
export default class MyComponent extends Vue {
private serverAddress = 'http://example.com';
private modalForm = { picture: 'example.jpg' };
private updateSrc() {
const newSrc = `${this.serverAddress}/${this.modalForm.picture}`;
const img = this.$refs.myImage as HTMLImageElement;
img.src = newSrc;
}
}
```
In this example, `updateSrc` method retrieves the current values of `serverAddress` and `modalForm.picture`, combines them to form a new URL, and assigns it to the `src` attribute of the `n-image` component. The `myImage` ref is used to access the `img` element in the DOM. Note that the code assumes that the `n-image` component has a `ref` attribute set to `myImage`.
阅读全文